@zonos/elements 1.3.19 → 1.3.20-alpha.1

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

@@ -2,6 +2,7 @@ import { h, Host, } from "@stencil/core";
 import { cartStore, cartStoreGetShippingTransitInfo, cartStoreUpdateSelectedShippingOption, } from "../../../store/checkout/cart";
 import { translate } from "../../../store/translationStore";
 import { trackConversionEvent } from "../../../utils/api/trackConversionEvent";
+import { sortServiceLevelOptions } from "../../../utils/checkout/sortServiceLevelOptions";
 import { formatCurrency } from "../../../utils/formatCurrency";
 import { submitGtag } from "../../../utils/submitGtag";
 export class ZonosShipping {
@@ -47,28 +48,35 @@ export class ZonosShipping {
         };
         this.initServiceLevels = () => {
             var _a;
-            this.serviceLevels =
-                ((_a = cartStore.shippingData) === null || _a === void 0 ? void 0 : _a.flatMap((item) => {
-                    var _a, _b;
-                    const { expectedDate, maxTransit, minTransit } = cartStoreGetShippingTransitInfo(item);
-                    const sublabel = expectedDate
-                        ? `${translate('Expected delivery')} ${expectedDate}`
-                        : '';
-                    const caption = minTransit && maxTransit
-                        ? `(${minTransit}-${maxTransit} ${translate('business days')})`
-                        : '';
-                    const shippingAmount = ((_b = (_a = cartStore.landedCostData) === null || _a === void 0 ? void 0 : _a.find(landedCostItem => { var _a; return ((_a = landedCostItem.landedCost) === null || _a === void 0 ? void 0 : _a.shipmentRating.id) === item.id; })) === null || _b === void 0 ? void 0 : _b.subtotals.shipping) || 0;
-                    return {
-                        caption,
-                        label: item.displayName,
-                        price: formatCurrency({
-                            amount: shippingAmount,
-                            currency: cartStore.currency,
-                        }),
-                        sublabel,
-                        value: item.id,
-                    };
-                })) || [];
+            const serviceLevels = ((_a = cartStore.shippingData) === null || _a === void 0 ? void 0 : _a.map((item) => {
+                var _a;
+                const { expectedDate, maxTransit, minTransit } = cartStoreGetShippingTransitInfo(item);
+                const sublabel = expectedDate
+                    ? `${translate('Expected delivery')} ${expectedDate}`
+                    : '';
+                const caption = minTransit && maxTransit
+                    ? `(${minTransit}-${maxTransit} ${translate('business days')})`
+                    : '';
+                const foundShipmentRating = (_a = cartStore.landedCostData) === null || _a === void 0 ? void 0 : _a.find(landedCostItem => { var _a; return ((_a = landedCostItem.landedCost) === null || _a === void 0 ? void 0 : _a.shipmentRating.id) === item.id; });
+                if (!foundShipmentRating) {
+                    // exclude shipping method if there is no matching landed cost data
+                    return null;
+                }
+                const shippingAmount = foundShipmentRating.subtotals.shipping;
+                return {
+                    amount: shippingAmount,
+                    caption,
+                    label: item.displayName,
+                    price: formatCurrency({
+                        amount: shippingAmount,
+                        currency: cartStore.currency,
+                    }),
+                    sublabel,
+                    value: item.id,
+                };
+            }).filter(Boolean)) || [];
+            // sort service level by price
+            this.serviceLevels = sortServiceLevelOptions(serviceLevels);
         };
         this.continueLoading = false;
         this.submitBtnColor = undefined;
@@ -82,7 +90,16 @@ export class ZonosShipping {
         this.initServiceLevels();
         const selectedServiceLevel = this.serviceLevels.find(item => { var _a; return item.value === ((_a = cartStore.selectedShippingOption) === null || _a === void 0 ? void 0 : _a.id); }) || null;
         if (selectedServiceLevel) {
+            // keep the selected shipping method
             this.selectedShippingMethod = selectedServiceLevel;
+            return;
+        }
+        const firstServiceLevel = this.serviceLevels.find(Boolean);
+        if (firstServiceLevel) {
+            // preselect the first shipping method
+            void this.handleRadioSelected({
+                detail: firstServiceLevel,
+            });
         }
     }
     render() {
@@ -91,7 +108,7 @@ export class ZonosShipping {
         if (this.showErrorBanner) {
             this.showErrorBanner = !this.handleValidate();
         }
-        return (h(Host, { key: '032c917dd5510a6a5801f0bf86a84bcf4096759e', class: "zonos--shipping zonos--elements" }, h("div", { key: 'b5052414ae56dc46908e53a1676acf96701bafa8', class: "zonos--group" }, h("zonos-text", { key: '41bb421c0fc620f8373be5453e872e83ad19150e', class: "zonos--title", type: "semiBoldSubheader" }, translate('Delivery options')), this.showErrorBanner && !!((_a = this.serviceLevels) === null || _a === void 0 ? void 0 : _a.length) && (h("zonos-banner", { key: '4b0119b9c1991ab31c15220ed26f0eac18c7229e', class: "zonos--error-banner", intent: "error" }, translate('No shipping method selected'))), h("zonos-text", { key: '61ea64f33b2b4bd54c4f2c4d273bac9e13d67040', class: "zonos--shipping-method-title", type: "semiBoldLabel" }, translate('Shipping method')), !((_b = this.serviceLevels) === null || _b === void 0 ? void 0 : _b.length) ? (h("zonos-banner", { bannerTitle: translate('No shipping methods found - please review and update your address details by selecting the "Customer" tab above. If you continue to encounter issues, contact our support team for assistance.'), intent: "error" })) : (h("zonos-shipping-rich-radio", { initialSelectedValue: (_c = this.selectedShippingMethod) === null || _c === void 0 ? void 0 : _c.value, items: this.serviceLevels, onRadioSelected: e => this.handleRadioSelected(e) })), h("div", { key: '1908b7445ef7158402882265af8a357f48096937', class: "zonos--group-btn" }, h("zonos-button", { key: 'b73ca7298b5c020c237703e4ce1f9b877cb96605', backgroundColor: this.submitBtnColor, loading: this.continueLoading || this.isSelecting, onClick: () => this.continueClickHandler(), size: "lg",
+        return (h(Host, { key: '7d55ffefe3cb926587a9b2d6617d732b52cf1a82', class: "zonos--shipping zonos--elements" }, h("div", { key: 'dfe3d7d7e0be1857a428c7c3dff5a60f45e2c843', class: "zonos--group" }, h("zonos-text", { key: 'dccf7b24862e88ee3ab8914b04a4ee02f02324fb', class: "zonos--title", type: "semiBoldSubheader" }, translate('Delivery options')), this.showErrorBanner && !!((_a = this.serviceLevels) === null || _a === void 0 ? void 0 : _a.length) && (h("zonos-banner", { key: 'c343522911e886a2365b795a9b95b17acbfa59c8', class: "zonos--error-banner", intent: "error" }, translate('No shipping method selected'))), h("zonos-text", { key: '83c873c95e5b7466cfba997a4385ea55771f2571', class: "zonos--shipping-method-title", type: "semiBoldLabel" }, translate('Shipping method')), !((_b = this.serviceLevels) === null || _b === void 0 ? void 0 : _b.length) ? (h("zonos-banner", { bannerTitle: translate('No shipping methods found - please review and update your address details by selecting the "Customer" tab above. If you continue to encounter issues, contact our support team for assistance.'), intent: "error" })) : (h("zonos-shipping-rich-radio", { initialSelectedValue: (_c = this.selectedShippingMethod) === null || _c === void 0 ? void 0 : _c.value, items: this.serviceLevels, onRadioSelected: e => this.handleRadioSelected(e) })), h("div", { key: 'c7dd64a8d84fa04629010d20010e89ea51c3b634', class: "zonos--group-btn" }, h("zonos-button", { key: '8d5ec0f9896be564ab659affd578939eff1c62dc', backgroundColor: this.submitBtnColor, loading: this.continueLoading || this.isSelecting, onClick: () => this.continueClickHandler(), size: "lg",
             // use primary type when on mobile mode
             variant: this.submitBtnType }, translate('Go to payment'))))));
     }

package/dist/collection/components/common/zonos-shipping-rich-radio/zonos-shipping-rich-radio.js

@@ -39,7 +39,7 @@ export class ZonosShippingRichRadio {
     }
     render() {
         var _a;
-        return (h(Host, { key: '14a3885f1e1513e9987cb27217cdb8722eab55fa', class: "zonos--shipping-rich-radio zonos--elements", "data-theme": this.theme, style: Object.assign(Object.assign({}, this.getRadioItemStyleVariables()), { '--font-family': zonosStoreFontFamily() }) }, (_a = this.items) === null || _a === void 0 ? void 0 : _a.map(item => {
+        return (h(Host, { key: '48381df130f6021b73c543c7244a71e7b1e8cd05', class: "zonos--shipping-rich-radio zonos--elements", "data-theme": this.theme, style: Object.assign(Object.assign({}, this.getRadioItemStyleVariables()), { '--font-family': zonosStoreFontFamily() }) }, (_a = this.items) === null || _a === void 0 ? void 0 : _a.map(item => {
             var _a;
             const selected = ((_a = this.selectedItem) === null || _a === void 0 ? void 0 : _a.value) === item.value;
             return (h("div", { "aria-hidden": "true", class: classes([
@@ -189,7 +189,7 @@ export class ZonosShippingRichRadio {
                 },
                 "complexType": {
                     "original": "ShippingRichRadioItem",
-                    "resolved": "{ caption?: string | undefined; label: string; price: string; sublabel?: string | undefined; value: string | number; }",
+                    "resolved": "{ amount: number; caption?: string | undefined; label: string; price: string; sublabel?: string | undefined; value: string | number; }",
                     "references": {
                         "ShippingRichRadioItem": {
                             "location": "local",

package/dist/collection/components/store/zonosStore.js

@@ -46,6 +46,10 @@ const { reset, state: zonosStore } = createStore(() => ({
     helloSettings: {
         anchorElementSelector: '',
         cartUrlPattern: '',
+        /**
+         * @TODO Default to URL_PARAM for now, and switch SESSION later when we have API save this info, and we have the ability to update setting of merchant store without having them do it.
+         */
+        countryOverrideBehavior: 'URL_PARAM',
         currencyBehavior: 'ENABLED',
         currencyElementSelector: '.money',
         dutyTaxEstimationBehavior: 'ENABLED',

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

@@ -0,0 +1,9 @@
+/**
+ * Sorts service levels with lower cost first
+ */
+export const sortServiceLevelOptions = (serviceLevels) => {
+    const sortedServiceLevels = serviceLevels.sort((a, b) => {
+        return a.amount - b.amount;
+    });
+    return sortedServiceLevels;
+};

package/dist/collection/components/utils/hello/setZCountryUrlParam.js

@@ -1,13 +1,20 @@
+import { zonosStore } from "../../store/zonosStore";
 export const setZCountryUrlParam = (selectedCountryCode) => {
     if (!selectedCountryCode) {
         return;
     }
     const urlSearchParams = new URLSearchParams(window.location.search);
-    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);
+    // Only append zCountry if it's already in the URL or the countryOverrideBehavior is URL_PARAM
+    const shouldAppendParam = urlSearchParams.has('zCountry') ||
+        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);
+    }
 };

package/dist/esm/{cart-1a37e002.js → cart-d3c98a81.js}

@@ -1,7 +1,7 @@
-import { c as createStore, z as zonosStore } from './zonosStore-32e33a45.js';
+import { c as createStore, z as zonosStore } from './zonosStore-0ce57f37.js';
 import { a as logError, l as log } from './logError-c456c092.js';
-import { i as isDarkColor } from './isDarkColor-39a36e82.js';
-import { g as getBorderRadius } from './getBorderRadius-d244b4b1.js';
+import { i as isDarkColor } from './isDarkColor-454ec221.js';
+import { g as getBorderRadius } from './getBorderRadius-393bf797.js';
 
 const stringsArabic = {
     '${percentage} GST due on any order above ${threshold} along with an import entry transaction fee and MPI levy.': {
@@ -6006,13 +6006,19 @@ const setZCountryUrlParam = (selectedCountryCode) => {
         return;
     }
     const urlSearchParams = new URLSearchParams(window.location.search);
-    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);
+    // Only append zCountry if it's already in the URL or the countryOverrideBehavior is URL_PARAM
+    const shouldAppendParam = urlSearchParams.has('zCountry') ||
+        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 { onChange: localizationStoreOnUpdate, state: localizationStore } = createStore({

package/dist/esm/{getBorderRadius-d244b4b1.js → getBorderRadius-393bf797.js}

@@ -1,4 +1,4 @@
-import { z as zonosStore } from './zonosStore-32e33a45.js';
+import { z as zonosStore } from './zonosStore-0ce57f37.js';
 
 /**
  * Get the border radius for the elements based on the style

package/dist/esm/index.js

@@ -232,8 +232,8 @@ const zonosLoadUrl = (() => {
     }
     return null;
 })();
-const ZONOS_URL = zonosLoadUrl || "https://v1.3.19.js.zonos.com";
-const JS_DELIVR_ZONOS_URL = "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.19";
+const ZONOS_URL = zonosLoadUrl || "https://v1.3.20-alpha.1.js.zonos.com";
+const JS_DELIVR_ZONOS_URL = "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.20-alpha.1";
 const INTER_FONT_URL = 'https://rsms.me';
 const GOOGLE_FONT_URL = 'https://fonts.googleapis.com';
 const INTER_FONT_REGEX = /^https:\/\/rsms\.me\/inter\/inter\.css(.*)$/;
@@ -253,7 +253,7 @@ Zonos.isBigCommerce = false;
 Zonos.isNpm = true;
 Zonos.internationalHideSelector = '';
 Zonos.zonosQaUrl = null;
-Zonos.version = `v${"1.3.19"}`;
+Zonos.version = `v${"1.3.20-alpha.1"}`;
 Zonos.modeAlerted = false;
 Zonos.tempCartData = null;
 Zonos.getCurrentTimestamp = () => new Date().getTime();

package/dist/esm/{isDarkColor-39a36e82.js → isDarkColor-454ec221.js}

@@ -1,4 +1,4 @@
-import { a as commonjsGlobal } from './zonosStore-32e33a45.js';
+import { a as commonjsGlobal } from './zonosStore-0ce57f37.js';
 
 var tinycolor$1 = {exports: {}};
 

package/dist/esm/{submitGtag-754935b4.js → submitGtag-acdb8bd7.js}

@@ -1,5 +1,5 @@
-import { r as handleFetch, d as cartStore, l as localizationStore } from './cart-1a37e002.js';
-import { z as zonosStore } from './zonosStore-32e33a45.js';
+import { r as handleFetch, d as cartStore, l as localizationStore } from './cart-d3c98a81.js';
+import { z as zonosStore } from './zonosStore-0ce57f37.js';
 import { l as log } from './logError-c456c092.js';
 
 const trackConversionEvent = async (eventName, metadata) => {

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

@@ -1,13 +1,13 @@
 import { r as registerInstance, c as createEvent, h, H as Host, d as getElement } from './index-3b46f3c3.js';
-import { h as stripeStore, l as localizationStore, t as translate } from './cart-1a37e002.js';
+import { h as stripeStore, l as localizationStore, t as translate } from './cart-d3c98a81.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';
-import { z as zonosStore, d as zonosStoreFontFamily } from './zonosStore-32e33a45.js';
+import { z as zonosStore, d as zonosStoreFontFamily } from './zonosStore-0ce57f37.js';
 import { c as classes } from './classes-0d95c529.js';
 import { R as RemoveIcon$1 } from './RemoveIcon-9dc5dd1a.js';
-import { g as getBorderRadius } from './getBorderRadius-d244b4b1.js';
-import { i as isDarkColor } from './isDarkColor-39a36e82.js';
+import { g as getBorderRadius } from './getBorderRadius-393bf797.js';
+import { i as isDarkColor } from './isDarkColor-454ec221.js';
 
 const zonosAddressCss = ".sc-zonos-address-h{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-address-h *.sc-zonos-address{font-family:var(--font-family, Inter), Inter}.sc-zonos-address-h img.sc-zonos-address{max-width:100%}.sc-zonos-address-h dl.sc-zonos-address,.sc-zonos-address-h dd.sc-zonos-address,.sc-zonos-address-h h1.sc-zonos-address,.sc-zonos-address-h h2.sc-zonos-address,.sc-zonos-address-h h3.sc-zonos-address,.sc-zonos-address-h h4.sc-zonos-address,.sc-zonos-address-h h5.sc-zonos-address,.sc-zonos-address-h h6.sc-zonos-address,.sc-zonos-address-h hr.sc-zonos-address,.sc-zonos-address-h figure.sc-zonos-address,.sc-zonos-address-h p.sc-zonos-address,.sc-zonos-address-h pre.sc-zonos-address{margin:0}.sc-zonos-address-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-address-h .zonos--title.sc-zonos-address{margin-bottom:16px}.sc-zonos-address-h zonos-banner.sc-zonos-address{margin-top:8px}";
 const ZonosAddressStyle0 = zonosAddressCss;

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

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host } from './index-3b46f3c3.js';
-import { d as zonosStoreFontFamily } from './zonosStore-32e33a45.js';
+import { d as zonosStoreFontFamily } from './zonosStore-0ce57f37.js';
 import { c as classes } from './classes-0d95c529.js';
 
 const zonosBadgeCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-inline-flexbox;display:inline-flex}:host .zonos--badge-content{display:-ms-flexbox;display:flex;gap:8px;font-size:var(--zonos-elements-font-size-s);padding:4px 8px;text-align:center;border-radius:var(--zonos-elements-radius-6);background-color:var(--zonos-elements-gray-100);color:var(--zonos-elements-gray-800);-ms-flex-align:center;align-items:center}:host p{font-weight:600;line-height:16px}:host .icon-right svg{-ms-flex-order:2;order:2}:host .small{padding:2px 8px}:host .rounded{border-radius:20px}:host .bold{background-color:var(--zonos-elements-gray-600);color:var(--zonos-elements-gray-100)}:host .blue{background-color:var(--zonos-elements-blue-100);color:var(--zonos-elements-blue-800)}:host .blue.bold{background-color:var(--zonos-elements-blue-600);color:var(--zonos-elements-blue-100)}:host .green{background-color:var(--zonos-elements-green-100);color:var(--zonos-elements-green-800)}:host .green.bold{background-color:var(--zonos-elements-green-600);color:var(--zonos-elements-green-100)}:host .red{background-color:var(--zonos-elements-red-100);color:var(--zonos-elements-red-800)}:host .red.bold{background-color:var(--zonos-elements-red-600);color:var(--zonos-elements-red-100)}:host .orange{background-color:var(--zonos-elements-orange-100);color:var(--zonos-elements-orange-800)}:host .orange.bold{background-color:var(--zonos-elements-orange-600);color:var(--zonos-elements-orange-100)}:host .purple{background-color:var(--zonos-elements-purple-100);color:var(--zonos-elements-purple-800)}:host .purple.bold{background-color:var(--zonos-elements-purple-600);color:var(--zonos-elements-purple-100)}:host .cyan{background-color:var(--zonos-elements-cyan-100);color:var(--zonos-elements-cyan-800)}:host .cyan.bold{background-color:var(--zonos-elements-cyan-600);color:var(--zonos-elements-cyan-100)}";

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

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host } from './index-3b46f3c3.js';
-import { d as zonosStoreFontFamily } from './zonosStore-32e33a45.js';
+import { d as zonosStoreFontFamily } from './zonosStore-0ce57f37.js';
 import { c as classes } from './classes-0d95c529.js';
 
 const zonosBannerCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{border-radius:var(--zonos-elements-radius-10);padding:16px;background:var(--zonos-elements-gray-100)}:host .zonos--container{display:grid;-ms-flex-align:center;align-items:center;grid-template-areas:\"icon header\" \". content\";grid-template-columns:32px auto 0}:host .zonos--icon-wrapper{grid-area:icon;display:-ms-flexbox;display:flex;justify-self:start}:host .zonos--header-wrapper{margin-top:0px;grid-area:header}:host .zonos--content-wrapper{grid-area:content;margin-top:4px}:host(.info){background-color:var(--zonos-elements-blue-100);border:1px solid var(--zonos-elements-blue-200)}:host(.success){background-color:var(--zonos-elements-green-100);border:1px solid var(--zonos-elements-green-200)}:host(.error){background-color:var(--zonos-elements-red-100);border:1px solid var(--zonos-elements-red-200)}:host(.warning){background-color:var(--zonos-elements-orange-100);border:1px solid var(--zonos-elements-orange-200)}";

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

@@ -1,9 +1,9 @@
 import { r as registerInstance, h, H as Host, d as getElement } from './index-3b46f3c3.js';
-import { z as zonosStore, d as zonosStoreFontFamily } from './zonosStore-32e33a45.js';
+import { z as zonosStore, d as zonosStoreFontFamily } from './zonosStore-0ce57f37.js';
 import { c as classes } from './classes-0d95c529.js';
-import { g as getBorderRadius } from './getBorderRadius-d244b4b1.js';
+import { g as getBorderRadius } from './getBorderRadius-393bf797.js';
 import { i as isColorVariable } from './isColorVariable-82457bef.js';
-import { i as isDarkColor } from './isDarkColor-39a36e82.js';
+import { i as isDarkColor } from './isDarkColor-454ec221.js';
 
 /**
  * Get theme for button text based on background color

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

@@ -1,11 +1,11 @@
 import { r as registerInstance, h, H as Host } from './index-3b46f3c3.js';
-import { d as zonosStoreFontFamily } from './zonosStore-32e33a45.js';
+import { d as zonosStoreFontFamily } from './zonosStore-0ce57f37.js';
 import { c as classes } from './classes-0d95c529.js';
-import { H as localizationStoreUpdateSelectedLocale, t as translate, l as localizationStore } from './cart-1a37e002.js';
+import { H as localizationStoreUpdateSelectedLocale, t as translate, l as localizationStore } from './cart-d3c98a81.js';
 import { l as languages } from './ILanguage-97790bee.js';
 import './logError-c456c092.js';
-import './isDarkColor-39a36e82.js';
-import './getBorderRadius-d244b4b1.js';
+import './isDarkColor-454ec221.js';
+import './getBorderRadius-393bf797.js';
 
 const zonosCardCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .styled-card{border:var(--zonos-elements-border);border-radius:var(--zonos-elements-radius-6);padding:var(--spacing, 24px);text-align:left}:host .styled-card hr{margin-left:calc(var(--spacing, 24px) * -1);margin-right:calc(var(--spacing, 24px) * -1)}:host .styled-card .card-header{margin:calc(var(--spacing, 24px) * -1);padding:var(--spacing, 24px);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing, 24px);border-bottom:var(--zonos-elements-border);height:65px;line-height:65px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host .styled-card .card-header h5{margin-bottom:0;-ms-flex:1;flex:1}:host .styled-card .card-footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;margin:calc(var(--spacing, 24px) * -1);padding:var(--spacing, 24px);border-top:var(--zonos-elements-border);background:var(--zonos-elements-surface-color-secondary);margin-top:var(--spacing, 24px);border-bottom-left-radius:var(--zonos-elements-radius-8);border-bottom-right-radius:var(--zonos-elements-radius-8);height:var(--footerHeight)}";
 const ZonosCardStyle0 = zonosCardCss;

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

@@ -1,12 +1,12 @@
 import { r as registerInstance, a as getAssetPath, h, H as Host, F as Fragment, c as createEvent, d as getElement } from './index-3b46f3c3.js';
-import { d as cartStore, C as cartStoreHasOneEligibleItem, t as translate, r as handleFetch, p as stripeStoreReset, h as stripeStore, D as stripeStoreRetrievePayment, l as localizationStore, E as stripeStoreTranslateAddressToLatin, F as cartStoreUpdateSelectedShippingOption, G as cartStoreGetShippingTransitInfo } from './cart-1a37e002.js';
+import { d as cartStore, C as cartStoreHasOneEligibleItem, t as translate, r as handleFetch, p as stripeStoreReset, h as stripeStore, D as stripeStoreRetrievePayment, l as localizationStore, E as stripeStoreTranslateAddressToLatin, F as cartStoreUpdateSelectedShippingOption, G as cartStoreGetShippingTransitInfo } from './cart-d3c98a81.js';
 import { c as classes } from './classes-0d95c529.js';
-import { z as zonosStore, g as getZonosStoreTheme, d as zonosStoreFontFamily } from './zonosStore-32e33a45.js';
-import { t as trackConversionEvent, s as sendErrorLog, a as submitGtag, c as createCustomEvent } from './submitGtag-754935b4.js';
-import { g as getBorderRadius } from './getBorderRadius-d244b4b1.js';
+import { z as zonosStore, g as getZonosStoreTheme, d as zonosStoreFontFamily } from './zonosStore-0ce57f37.js';
+import { t as trackConversionEvent, s as sendErrorLog, a as submitGtag, c as createCustomEvent } from './submitGtag-acdb8bd7.js';
+import { g as getBorderRadius } from './getBorderRadius-393bf797.js';
 import { i as isCheckoutMobile } from './isCheckoutMobile-8846dccb.js';
 import { l as languages } from './ILanguage-97790bee.js';
-import { t as tinycolor, i as isDarkColor } from './isDarkColor-39a36e82.js';
+import { t as tinycolor, i as isDarkColor } from './isDarkColor-454ec221.js';
 import { i as isColorVariable } from './isColorVariable-82457bef.js';
 import { c as containsNonLatinChars } from './containsNonLatinChars-2d8810c3.js';
 import './logError-c456c092.js';
@@ -353,7 +353,7 @@ const ZonosIcon = `<svg width="105" height="29" viewBox="0 0 105 29" fill="none"
 </svg>
 `;
 
-const zonosCheckoutFooterCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{position:absolute;bottom:-50px;left:0;right:0;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;z-index:2}:host .zonos--checkout-footer{width:calc(90vw - 22px);gap:16px;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:12px;-ms-flex-align:center;align-items:center}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:24px}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper .zonos--checkout-footer-logo{display:-ms-inline-flexbox;display:inline-flex;gap:8px;-ms-flex-align:center;align-items:center}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper .zonos--checkout-footer-logo a{line-height:0}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper a{text-decoration:none}:host .zonos--checkout-footer zonos-button button.outline{outline:1px solid var(--zonos-elements-gray-800)}:host .zonos--checkout-footer .zonos--checkout-locale-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:8px;position:relative}@media (max-width: 400px){:host .zonos--checkout-footer .zonos--checkout-locale-wrapper{gap:4px}}:host .zonos--checkout-footer .zonos--checkout-footer-dialog{position:absolute;bottom:36px;left:var(--language-dialog-left);background:var(--zonos-elements-surface-color);-webkit-box-shadow:var(--zonos-elements-v3-shadow-xl);box-shadow:var(--zonos-elements-v3-shadow-xl);border-radius:var(--zonos-elements-radius-12);width:360px;max-width:100vw;max-height:500px;z-index:10005;overflow:auto;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:bottom left;transform-origin:bottom left;opacity:0;-webkit-transition:opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;transition:opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;transition:transform 0.3s ease-out, opacity 0.3s ease-out;transition:transform 0.3s ease-out, opacity 0.3s ease-out, -webkit-transform 0.3s ease-out}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar{width:10px}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-track{background:var(--zonos-elements-gray-50)}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-thumb:hover{background:#d6d6d6}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-track{border-top-right-radius:var(--zonos-elements-radius-12);border-bottom-right-radius:var(--zonos-elements-radius-12)}:host .zonos--checkout-footer .zonos--checkout-footer-dialog.zonos--checkout-footer-dialog-open{opacity:1;-webkit-transform:scale(1);transform:scale(1)}:host(.mobile){-ms-flex-direction:column;flex-direction:column;gap:32px;background:var(--zonos-elements-gray-0);position:relative;padding-top:24px;bottom:0}:host(.mobile) .zonos--checkout-footer{-ms-flex-direction:column;flex-direction:column;gap:4px}:host(.mobile) .zonos--checkout-locale-wrapper{-ms-flex-direction:column;flex-direction:column}:host(.mobile) .zonos--checkout-footer-icon-wrapper{-ms-flex-direction:column;flex-direction:column}:host(.mobile) .zonos--checkout-footer-dialog{position:fixed;left:0;right:0;bottom:0;-webkit-transform-origin:bottom center;transform-origin:bottom center;width:100vw}";
+const zonosCheckoutFooterCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{position:absolute;bottom:-50px;left:0;right:0;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;z-index:2}:host .zonos--checkout-footer{width:calc(90vw - 22px);gap:16px;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:12px;padding-left:0;-ms-flex-align:center;align-items:center}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:24px}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper .zonos--checkout-footer-logo{display:-ms-inline-flexbox;display:inline-flex;gap:8px;-ms-flex-align:center;align-items:center}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper .zonos--checkout-footer-logo a{line-height:0}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper a{text-decoration:none}:host .zonos--checkout-footer zonos-button button.outline{outline:1px solid var(--zonos-elements-gray-800)}:host .zonos--checkout-footer .zonos--checkout-locale-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:8px;position:relative}@media (max-width: 400px){:host .zonos--checkout-footer .zonos--checkout-locale-wrapper{gap:4px}}:host .zonos--checkout-footer .zonos--checkout-footer-dialog{position:absolute;bottom:36px;left:var(--language-dialog-left);background:var(--zonos-elements-surface-color);-webkit-box-shadow:var(--zonos-elements-v3-shadow-xl);box-shadow:var(--zonos-elements-v3-shadow-xl);border-radius:var(--zonos-elements-radius-12);width:360px;max-width:100vw;max-height:500px;z-index:10005;overflow:auto;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:bottom left;transform-origin:bottom left;opacity:0;-webkit-transition:opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;transition:opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;transition:transform 0.3s ease-out, opacity 0.3s ease-out;transition:transform 0.3s ease-out, opacity 0.3s ease-out, -webkit-transform 0.3s ease-out}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar{width:10px}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-track{background:var(--zonos-elements-gray-50)}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-thumb:hover{background:#d6d6d6}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-track{border-top-right-radius:var(--zonos-elements-radius-12);border-bottom-right-radius:var(--zonos-elements-radius-12)}:host .zonos--checkout-footer .zonos--checkout-footer-dialog.zonos--checkout-footer-dialog-open{opacity:1;-webkit-transform:scale(1);transform:scale(1)}:host(.mobile){-ms-flex-direction:column;flex-direction:column;gap:32px;background:var(--zonos-elements-gray-0);position:relative;padding-top:24px;bottom:0}:host(.mobile) .zonos--checkout-footer{-ms-flex-direction:column;flex-direction:column;gap:4px}:host(.mobile) .zonos--checkout-locale-wrapper{-ms-flex-direction:column;flex-direction:column}:host(.mobile) .zonos--checkout-footer-icon-wrapper{-ms-flex-direction:column;flex-direction:column}:host(.mobile) .zonos--checkout-footer-dialog{position:fixed;left:0;right:0;bottom:0;-webkit-transform-origin:bottom center;transform-origin:bottom center;width:100vw}";
 const ZonosCheckoutFooterStyle0 = zonosCheckoutFooterCss;
 
 const ZonosCheckoutFooter = class {
@@ -883,6 +883,16 @@ const ZonosReview = class {
 };
 ZonosReview.style = ZonosReviewStyle0;
 
+/**
+ * Sorts service levels with lower cost first
+ */
+const sortServiceLevelOptions = (serviceLevels) => {
+    const sortedServiceLevels = serviceLevels.sort((a, b) => {
+        return a.amount - b.amount;
+    });
+    return sortedServiceLevels;
+};
+
 const zonosShippingCss = ".sc-zonos-shipping-h{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-shipping-h *.sc-zonos-shipping{font-family:var(--font-family, Inter), Inter}.sc-zonos-shipping-h img.sc-zonos-shipping{max-width:100%}.sc-zonos-shipping-h dl.sc-zonos-shipping,.sc-zonos-shipping-h dd.sc-zonos-shipping,.sc-zonos-shipping-h h1.sc-zonos-shipping,.sc-zonos-shipping-h h2.sc-zonos-shipping,.sc-zonos-shipping-h h3.sc-zonos-shipping,.sc-zonos-shipping-h h4.sc-zonos-shipping,.sc-zonos-shipping-h h5.sc-zonos-shipping,.sc-zonos-shipping-h h6.sc-zonos-shipping,.sc-zonos-shipping-h hr.sc-zonos-shipping,.sc-zonos-shipping-h figure.sc-zonos-shipping,.sc-zonos-shipping-h p.sc-zonos-shipping,.sc-zonos-shipping-h pre.sc-zonos-shipping{margin:0}.sc-zonos-shipping-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-shipping-h{overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.sc-zonos-shipping-h .zonos--title.sc-zonos-shipping{margin-bottom:24px}.sc-zonos-shipping-h .zonos--shipping-method-title.sc-zonos-shipping{margin-bottom:16px}.sc-zonos-shipping-h .zonos-shipping-rich-radio.sc-zonos-shipping{margin-bottom:24px}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping{margin-bottom:20px;overflow:auto;padding:5px}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar{width:10px}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar-track{background:var(--zonos-elements-gray-50)}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar-thumb:hover{background:#d6d6d6}.sc-zonos-shipping-h .zonos--error-banner.sc-zonos-shipping{margin-bottom:16px}.sc-zonos-shipping-h zonos-button.sc-zonos-shipping{-webkit-box-shadow:0 0 1px 0 var(--zonos-elements-gray-600);box-shadow:0 0 1px 0 var(--zonos-elements-gray-600)}.sc-zonos-shipping-h .zonos--group-btn.sc-zonos-shipping{position:-webkit-sticky;position:sticky;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;bottom:0;margin-top:12px;background:var(--primary-color, var(--zonos-elements-gray-0))}.sc-zonos-shipping-h .zonos--group-btn.sc-zonos-shipping zonos-button.sc-zonos-shipping{width:100%}.sc-zonos-shipping-h zonos-banner.sc-zonos-shipping{margin-top:24px}";
 const ZonosShippingStyle0 = zonosShippingCss;
 
@@ -931,28 +941,35 @@ const ZonosShipping = class {
         };
         this.initServiceLevels = () => {
             var _a;
-            this.serviceLevels =
-                ((_a = cartStore.shippingData) === null || _a === void 0 ? void 0 : _a.flatMap((item) => {
-                    var _a, _b;
-                    const { expectedDate, maxTransit, minTransit } = cartStoreGetShippingTransitInfo(item);
-                    const sublabel = expectedDate
-                        ? `${translate('Expected delivery')} ${expectedDate}`
-                        : '';
-                    const caption = minTransit && maxTransit
-                        ? `(${minTransit}-${maxTransit} ${translate('business days')})`
-                        : '';
-                    const shippingAmount = ((_b = (_a = cartStore.landedCostData) === null || _a === void 0 ? void 0 : _a.find(landedCostItem => { var _a; return ((_a = landedCostItem.landedCost) === null || _a === void 0 ? void 0 : _a.shipmentRating.id) === item.id; })) === null || _b === void 0 ? void 0 : _b.subtotals.shipping) || 0;
-                    return {
-                        caption,
-                        label: item.displayName,
-                        price: formatCurrency({
-                            amount: shippingAmount,
-                            currency: cartStore.currency,
-                        }),
-                        sublabel,
-                        value: item.id,
-                    };
-                })) || [];
+            const serviceLevels = ((_a = cartStore.shippingData) === null || _a === void 0 ? void 0 : _a.map((item) => {
+                var _a;
+                const { expectedDate, maxTransit, minTransit } = cartStoreGetShippingTransitInfo(item);
+                const sublabel = expectedDate
+                    ? `${translate('Expected delivery')} ${expectedDate}`
+                    : '';
+                const caption = minTransit && maxTransit
+                    ? `(${minTransit}-${maxTransit} ${translate('business days')})`
+                    : '';
+                const foundShipmentRating = (_a = cartStore.landedCostData) === null || _a === void 0 ? void 0 : _a.find(landedCostItem => { var _a; return ((_a = landedCostItem.landedCost) === null || _a === void 0 ? void 0 : _a.shipmentRating.id) === item.id; });
+                if (!foundShipmentRating) {
+                    // exclude shipping method if there is no matching landed cost data
+                    return null;
+                }
+                const shippingAmount = foundShipmentRating.subtotals.shipping;
+                return {
+                    amount: shippingAmount,
+                    caption,
+                    label: item.displayName,
+                    price: formatCurrency({
+                        amount: shippingAmount,
+                        currency: cartStore.currency,
+                    }),
+                    sublabel,
+                    value: item.id,
+                };
+            }).filter(Boolean)) || [];
+            // sort service level by price
+            this.serviceLevels = sortServiceLevelOptions(serviceLevels);
         };
         this.continueLoading = false;
         this.submitBtnColor = undefined;
@@ -966,7 +983,16 @@ const ZonosShipping = class {
         this.initServiceLevels();
         const selectedServiceLevel = this.serviceLevels.find(item => { var _a; return item.value === ((_a = cartStore.selectedShippingOption) === null || _a === void 0 ? void 0 : _a.id); }) || null;
         if (selectedServiceLevel) {
+            // keep the selected shipping method
             this.selectedShippingMethod = selectedServiceLevel;
+            return;
+        }
+        const firstServiceLevel = this.serviceLevels.find(Boolean);
+        if (firstServiceLevel) {
+            // preselect the first shipping method
+            void this.handleRadioSelected({
+                detail: firstServiceLevel,
+            });
         }
     }
     render() {
@@ -975,7 +1001,7 @@ const ZonosShipping = class {
         if (this.showErrorBanner) {
             this.showErrorBanner = !this.handleValidate();
         }
-        return (h(Host, { key: '032c917dd5510a6a5801f0bf86a84bcf4096759e', class: "zonos--shipping zonos--elements" }, h("div", { key: 'b5052414ae56dc46908e53a1676acf96701bafa8', class: "zonos--group" }, h("zonos-text", { key: '41bb421c0fc620f8373be5453e872e83ad19150e', class: "zonos--title", type: "semiBoldSubheader" }, translate('Delivery options')), this.showErrorBanner && !!((_a = this.serviceLevels) === null || _a === void 0 ? void 0 : _a.length) && (h("zonos-banner", { key: '4b0119b9c1991ab31c15220ed26f0eac18c7229e', class: "zonos--error-banner", intent: "error" }, translate('No shipping method selected'))), h("zonos-text", { key: '61ea64f33b2b4bd54c4f2c4d273bac9e13d67040', class: "zonos--shipping-method-title", type: "semiBoldLabel" }, translate('Shipping method')), !((_b = this.serviceLevels) === null || _b === void 0 ? void 0 : _b.length) ? (h("zonos-banner", { bannerTitle: translate('No shipping methods found - please review and update your address details by selecting the "Customer" tab above. If you continue to encounter issues, contact our support team for assistance.'), intent: "error" })) : (h("zonos-shipping-rich-radio", { initialSelectedValue: (_c = this.selectedShippingMethod) === null || _c === void 0 ? void 0 : _c.value, items: this.serviceLevels, onRadioSelected: e => this.handleRadioSelected(e) })), h("div", { key: '1908b7445ef7158402882265af8a357f48096937', class: "zonos--group-btn" }, h("zonos-button", { key: 'b73ca7298b5c020c237703e4ce1f9b877cb96605', backgroundColor: this.submitBtnColor, loading: this.continueLoading || this.isSelecting, onClick: () => this.continueClickHandler(), size: "lg",
+        return (h(Host, { key: '7d55ffefe3cb926587a9b2d6617d732b52cf1a82', class: "zonos--shipping zonos--elements" }, h("div", { key: 'dfe3d7d7e0be1857a428c7c3dff5a60f45e2c843', class: "zonos--group" }, h("zonos-text", { key: 'dccf7b24862e88ee3ab8914b04a4ee02f02324fb', class: "zonos--title", type: "semiBoldSubheader" }, translate('Delivery options')), this.showErrorBanner && !!((_a = this.serviceLevels) === null || _a === void 0 ? void 0 : _a.length) && (h("zonos-banner", { key: 'c343522911e886a2365b795a9b95b17acbfa59c8', class: "zonos--error-banner", intent: "error" }, translate('No shipping method selected'))), h("zonos-text", { key: '83c873c95e5b7466cfba997a4385ea55771f2571', class: "zonos--shipping-method-title", type: "semiBoldLabel" }, translate('Shipping method')), !((_b = this.serviceLevels) === null || _b === void 0 ? void 0 : _b.length) ? (h("zonos-banner", { bannerTitle: translate('No shipping methods found - please review and update your address details by selecting the "Customer" tab above. If you continue to encounter issues, contact our support team for assistance.'), intent: "error" })) : (h("zonos-shipping-rich-radio", { initialSelectedValue: (_c = this.selectedShippingMethod) === null || _c === void 0 ? void 0 : _c.value, items: this.serviceLevels, onRadioSelected: e => this.handleRadioSelected(e) })), h("div", { key: 'c7dd64a8d84fa04629010d20010e89ea51c3b634', class: "zonos--group-btn" }, h("zonos-button", { key: '8d5ec0f9896be564ab659affd578939eff1c62dc', backgroundColor: this.submitBtnColor, loading: this.continueLoading || this.isSelecting, onClick: () => this.continueClickHandler(), size: "lg",
             // use primary type when on mobile mode
             variant: this.submitBtnType }, translate('Go to payment'))))));
     }

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

@@ -1,12 +1,12 @@
 import { r as registerInstance, h, F as Fragment, H as Host } from './index-3b46f3c3.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 stripeStore, j as stripeStoreInitCheckoutSession, k as cartStoreUpdateToErrorState, t as translate, m as stripeStorePrefetchLandedCost, n as cartStoreNextStep, o as stripeStoreConfirmPayment, p as stripeStoreReset, q as localizationStoreOnUpdate } from './cart-1a37e002.js';
-import { z as zonosStore, g as getZonosStoreTheme, m as mergeConfig } from './zonosStore-32e33a45.js';
-import { c as createCustomEvent, s as sendErrorLog, a as submitGtag, t as trackConversionEvent } from './submitGtag-754935b4.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 stripeStore, j as stripeStoreInitCheckoutSession, k as cartStoreUpdateToErrorState, t as translate, m as stripeStorePrefetchLandedCost, n as cartStoreNextStep, o as stripeStoreConfirmPayment, p as stripeStoreReset, q as localizationStoreOnUpdate } from './cart-d3c98a81.js';
+import { z as zonosStore, g as getZonosStoreTheme, m as mergeConfig } from './zonosStore-0ce57f37.js';
+import { c as createCustomEvent, s as sendErrorLog, a as submitGtag, t as trackConversionEvent } from './submitGtag-acdb8bd7.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';
-import { g as getBorderRadius } from './getBorderRadius-d244b4b1.js';
-import { i as isDarkColor } from './isDarkColor-39a36e82.js';
+import { g as getBorderRadius } from './getBorderRadius-393bf797.js';
+import { i as isDarkColor } from './isDarkColor-454ec221.js';
 import { R as RemoveIcon } from './RemoveIcon-9dc5dd1a.js';
 
 /**

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

@@ -1,9 +1,9 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-3b46f3c3.js';
-import { r as handleFetch, u as isValidSelector, h as stripeStore, v as initLocalizationStore, a as localizationStoreUpdateSelectedCountryCode } from './cart-1a37e002.js';
-import { z as zonosStore, b as zonosStoreInitSetting, d as zonosStoreFontFamily } from './zonosStore-32e33a45.js';
+import { r as handleFetch, u as isValidSelector, h as stripeStore, v as initLocalizationStore, a as localizationStoreUpdateSelectedCountryCode } from './cart-d3c98a81.js';
+import { z as zonosStore, b as zonosStoreInitSetting, d as zonosStoreFontFamily } from './zonosStore-0ce57f37.js';
 import { a as logError, l as log } from './logError-c456c092.js';
-import './isDarkColor-39a36e82.js';
-import './getBorderRadius-d244b4b1.js';
+import './isDarkColor-454ec221.js';
+import './getBorderRadius-393bf797.js';
 
 const getZonosSettings = async () => {
     const url = `${"https://v1.route.js.zonos.com"}/api/zonos-elements/zonos-settings`;

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

@@ -1,10 +1,10 @@
 import { r as registerInstance, h, H as Host, d as getElement } from './index-3b46f3c3.js';
-import { l as localizationStore } from './cart-1a37e002.js';
-import { d as zonosStoreFontFamily } from './zonosStore-32e33a45.js';
+import { l as localizationStore } from './cart-d3c98a81.js';
+import { d as zonosStoreFontFamily } from './zonosStore-0ce57f37.js';
 import { c as classes } from './classes-0d95c529.js';
 import './logError-c456c092.js';
-import './isDarkColor-39a36e82.js';
-import './getBorderRadius-d244b4b1.js';
+import './isDarkColor-454ec221.js';
+import './getBorderRadius-393bf797.js';
 
 const zonosCountryFlagCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-inline-flexbox;display:inline-flex}:host .flag-container{position:relative;overflow:hidden;width:100%;height:100%}:host .flag-icon{position:absolute;top:0;left:0;width:100%;height:100%;background-position:center;background-repeat:no-repeat;background-size:cover}";
 const ZonosCountryFlagStyle0 = zonosCountryFlagCss;

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

@@ -1,11 +1,11 @@
 import { r as registerInstance, h, H as Host, d as getElement } from './index-3b46f3c3.js';
-import { a as localizationStoreUpdateSelectedCountryCode, l as localizationStore } from './cart-1a37e002.js';
-import { d as zonosStoreFontFamily } from './zonosStore-32e33a45.js';
+import { a as localizationStoreUpdateSelectedCountryCode, l as localizationStore } from './cart-d3c98a81.js';
+import { d as zonosStoreFontFamily } from './zonosStore-0ce57f37.js';
 import { f as formatStringWithLinks } from './formatStringWithLinks-9e819405.js';
-import { i as isDarkColor } from './isDarkColor-39a36e82.js';
+import { i as isDarkColor } from './isDarkColor-454ec221.js';
 import { l as languages } from './ILanguage-97790bee.js';
 import './logError-c456c092.js';
-import './getBorderRadius-d244b4b1.js';
+import './getBorderRadius-393bf797.js';
 
 /**
  * Fuse.js v7.0.0 - Lightweight fuzzy-search (http://fusejs.io)

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

@@ -1,12 +1,12 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-3b46f3c3.js';
-import { B as currencyFormat, t as translate, l as localizationStore } from './cart-1a37e002.js';
-import { z as zonosStore } from './zonosStore-32e33a45.js';
+import { B as currencyFormat, t as translate, l as localizationStore } from './cart-d3c98a81.js';
+import { z as zonosStore } from './zonosStore-0ce57f37.js';
 import { c as classes } from './classes-0d95c529.js';
 import { f as formatStringWithLinks } from './formatStringWithLinks-9e819405.js';
 import { g as getHasMoreSpaceOnRight } from './getHasMoreSpaceOnRight-70eb913a.js';
 import './logError-c456c092.js';
-import './isDarkColor-39a36e82.js';
-import './getBorderRadius-d244b4b1.js';
+import './isDarkColor-454ec221.js';
+import './getBorderRadius-393bf797.js';
 
 const getHasMoreSpaceAbove = (ref) => {
     const componentRect = ref.getBoundingClientRect();

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

@@ -1,11 +1,11 @@
 import { r as registerInstance, h, H as Host } from './index-3b46f3c3.js';
-import { _ as _root, e as _baseGetTag, i as isObjectLike_1, f as isObject_1, z as zonosStore, g as getZonosStoreTheme, m as mergeConfig } from './zonosStore-32e33a45.js';
-import { r as handleFetch, l as localizationStore, u as isValidSelector, t as translate, w as getZCountryUrlParam, x as setZCountryUrlParam, y as currencyDisplay, z as currencyConvertAndFormat, A as currencyConvert, B as currencyFormat } from './cart-1a37e002.js';
+import { _ as _root, e as _baseGetTag, i as isObjectLike_1, f as isObject_1, z as zonosStore, g as getZonosStoreTheme, m as mergeConfig } from './zonosStore-0ce57f37.js';
+import { r as handleFetch, l as localizationStore, u as isValidSelector, t as translate, w as getZCountryUrlParam, x as setZCountryUrlParam, y as currencyDisplay, z as currencyConvertAndFormat, A as currencyConvert, B as currencyFormat } from './cart-d3c98a81.js';
 import { c as classes } from './classes-0d95c529.js';
 import { a as logError, l as log } from './logError-c456c092.js';
 import { g as getHasMoreSpaceOnRight } from './getHasMoreSpaceOnRight-70eb913a.js';
-import './isDarkColor-39a36e82.js';
-import './getBorderRadius-d244b4b1.js';
+import './isDarkColor-454ec221.js';
+import './getBorderRadius-393bf797.js';
 
 var root = _root;