@zonos/elements 1.3.270 → 1.3.273

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

@@ -3,20 +3,20 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const cart = require('./cart-3ff48a0e.js');
-const localization = require('./localization-5c1c9c6a.js');
-const renderCheckoutCurrency = require('./renderCheckoutCurrency-e9d8efa8.js');
+const cart = require('./cart-660e115c.js');
+const localization = require('./localization-f4a64f6f.js');
+const renderCheckoutCurrency = require('./renderCheckoutCurrency-cad156a7.js');
 const cleanHtmlMarkdown = require('./cleanHtmlMarkdown-31da84b7.js');
 const classes = require('./classes-b7918f56.js');
 const zonosStore = require('./zonosStore-45a87908.js');
-const hasInclusivePrice = require('./hasInclusivePrice-aec06153.js');
-const paypal = require('./paypal-c55b6c45.js');
+const hasInclusivePrice = require('./hasInclusivePrice-b35e81aa.js');
+const paypal = require('./paypal-125259ab.js');
 const handleFetch = require('./handleFetch-954f30e1.js');
 const createCustomEvent = require('./createCustomEvent-7b6fad95.js');
 const getBorderRadius = require('./getBorderRadius-fc683d94.js');
 const VarianceTest = require('./VarianceTest-bec00ea8.js');
 const ILanguage = require('./ILanguage-98b04442.js');
-const placeTestOrder = require('./placeTestOrder-230f534b.js');
+const placeTestOrder = require('./placeTestOrder-02001a99.js');
 const isDarkColor = require('./isDarkColor-5d6ca405.js');
 const getContrastColor = require('./getContrastColor-d5134ef3.js');
 const isColorVariable = require('./isColorVariable-525dbfa7.js');
@@ -40,7 +40,7 @@ const ZonosCartItems = class {
     render() {
         const emptyItemImg = index.getAssetPath('./assets/empty-item.jpeg');
         const nonRestrictedItems = cart.cartStore.items.filter(item => !item.isRestricted);
-        return (index.h(index.Host, { key: '0533f9858716c5084f2f7d454038918dcea3f1d0', class: "zonos--cart-items zonos--elements" }, index.h("table", { key: '9819698277a5c597528364d19b7c5c7c3161fdd7', class: "zonos--cart-table" }, index.h("tbody", { key: '59493dfb49143a56f2addaf0c9eb1e8ce014dc1f' }, nonRestrictedItems.map(item => {
+        return (index.h(index.Host, { key: 'ec83033ab6a41452e8d3f611ca59f571741d7c73', class: "zonos--cart-items zonos--elements" }, index.h("table", { key: '3f403b3e3943f13394e419b6d3e01629ed673cd8', class: "zonos--cart-table" }, index.h("tbody", { key: '0c2caccc03dd36d00453e88ac7df9d8e3c47b5f1' }, nonRestrictedItems.map(item => {
             const itemImg = item.imageUrl;
             const cleanedItemNames = cleanHtmlMarkdown.cleanHtmlMarkdown(item.name);
             const amount = item.amount * item.quantity;
@@ -963,11 +963,11 @@ const ZonosCheckoutFinish = class {
     }
     render() {
         const isTestMode = handleFetch.getIsTestMode();
-        return (index.h(index.Host, { key: '3df50a75327f2dd1d7eea538aed0501c96504f2d', class: "zonos--checkout-finish zonos--elements", style: {
+        return (index.h(index.Host, { key: '7bbe3b38422e6b6a0b7a98c8e9cacf4b6abbfd8f', class: "zonos--checkout-finish zonos--elements", style: {
                 '--zonos--border-radius': getBorderRadius.getBorderRadius({
                     overrideBorderStyle: this.borderRadius,
                 }),
-            } }, this.isImmediateRedirecting && (index.h("div", { key: '6031b9b4d5847bb46a201ccf7f6b1cd036b3e3df', class: "loading-wrapper" }, index.h("zonos-spinner", { key: 'e816086c5efdfe8c1b40ce0bad935ef829a8f88d', size: 48 }))), !this.isLoading && !this.isImmediateRedirecting && (index.h("div", { key: 'c787a355834af35a53f09f51f97c6796fa25c345', class: "zonos--finish-details" }, index.h("div", { key: 'a2a4bd3caee1cbffd514dcd69927a0f8a4e20af1', class: "zonos--group" }, this.notificationType === 'success' ? (index.h("zonos-icon", { "aria-label": "Order success", content: SuccessIcon, iconColor: 'blue-800', size: 50 })) : (index.h("zonos-icon", { "aria-label": "Order failed", content: RemoveIcon, iconColor: 'red-800', size: 50 })), index.h("zonos-text", { key: '894069f110eab9cb02fe4dfa814d7c285dadf7cb', class: "zonos--title", type: "semiBoldSubheader" }, this.notificationTitle), index.h("zonos-text", { key: '95bee491e9ac903a594569c911a81c63ebfab691', class: "zonos--subtitle", textColor: "gray-600" }, this.notificationMessages.map(message => (index.h(index.Fragment, null, message, index.h("br", null))))), this.shouldRenderCloseButtonForRedirectBehavior() && (index.h("zonos-button", { key: 'cf10c1bdfe95c5a13a2714fc7d64042fa7ef49ac',
+            } }, this.isImmediateRedirecting && (index.h("div", { key: '8608faad8369cb1ad3e208862d264cc176f37702', class: "loading-wrapper" }, index.h("zonos-spinner", { key: '749ea9f925a11859310a47280f906f4e54cff7b2', size: 48 }))), !this.isLoading && !this.isImmediateRedirecting && (index.h("div", { key: 'ccb75f51c73fa22e94771f4ff00456a042185fb7', class: "zonos--finish-details" }, index.h("div", { key: '4bb0e457e963c2c95517a1688d0dcfdaa2c94013', class: "zonos--group" }, this.notificationType === 'success' ? (index.h("zonos-icon", { "aria-label": "Order success", content: SuccessIcon, iconColor: 'blue-800', size: 50 })) : (index.h("zonos-icon", { "aria-label": "Order failed", content: RemoveIcon, iconColor: 'red-800', size: 50 })), index.h("zonos-text", { key: '7b57ab0d072852734a54833153d9a4aef526f97d', class: "zonos--title", type: "semiBoldSubheader" }, this.notificationTitle), index.h("zonos-text", { key: 'b633c665c126225ab060f806e150d77e118b7f6a', class: "zonos--subtitle", textColor: "gray-600" }, this.notificationMessages.map(message => (index.h(index.Fragment, null, message, index.h("br", null))))), this.shouldRenderCloseButtonForRedirectBehavior() && (index.h("zonos-button", { key: 'f15e8bef4931917ec51a5c449b6d20e76c295cbf',
             // Only show loading spinner if it's not an error notification
             loading: this.isWaitingToRedirect &&
                 this.notificationType !== 'error', onClick: () => {
@@ -979,9 +979,9 @@ const ZonosCheckoutFinish = class {
                 }
                 this.closeClickHandler();
             }, size: "md", variant: "primary" }, localization.translate('Close'))), !window.Zonos.isLegacyCheckout &&
-            this.shouldRenderKeepShoppingButton() && (index.h("zonos-button", { key: 'cc9da3752636dbf9ecd3446fb787074cb1fa725b', onClick: () => this.closeClickHandler(), size: "md", variant: "primary" }, this.notificationActionText))), isTestMode &&
+            this.shouldRenderKeepShoppingButton() && (index.h("zonos-button", { key: 'f450a254f244806612f269f90ce984167c787795', onClick: () => this.closeClickHandler(), size: "md", variant: "primary" }, this.notificationActionText))), isTestMode &&
             cart.cartStore.step === 'finish' &&
-            this.notificationType === 'success' && (index.h("div", { key: 'f61fedefbfcf3650377bfd2e1a86d7feb4129b12', class: "zonos--finish-button-wrapper" }, index.h("zonos-button", { key: 'fa794be3da7f480bc3682a2e932ee1f876ac5bb2', backgroundColor: "gray-0", buttonColor: "gray-1000", onClick: () => this.closeClickHandler(), size: "lg", variant: "outline" }, "New test cart"), index.h("zonos-button", { key: '5bbff8ed5b5c585dd1a4ca8e2d206d48fb080f39', onClick: () => {
+            this.notificationType === 'success' && (index.h("div", { key: 'd5ab67cad67c9b62e2e369c52f028aca0fb485b5', class: "zonos--finish-button-wrapper" }, index.h("zonos-button", { key: '1ab66e026b3797e2fc0f44fe0bcea439dab85128', backgroundColor: "gray-0", buttonColor: "gray-1000", onClick: () => this.closeClickHandler(), size: "lg", variant: "outline" }, "New test cart"), index.h("zonos-button", { key: '8fc0dc456bb32fb94ea390bf50a9590b35bbb04d', onClick: () => {
                 const isZonosDashboard = window.location.hostname.includes('dashboard.zonos.com');
                 this.redirectToUrl(isZonosDashboard
                     ? '/orders/all'
@@ -1055,10 +1055,10 @@ const ZonosCheckoutFooter = class {
         const languageLabel = (_a = ILanguage.languages.find(x => x.code === localization.localizationStore.selectedLocale)) === null || _a === void 0 ? void 0 : _a.label;
         // reverse color when on desktop. With the coversheet backdrop, the color should be white
         const colorDesktop = this.dataTheme === 'LIGHT' && !this.mobile ? 'gray-0' : 'gray-1000';
-        return (index.h(index.Host, { key: '9bf4e1fae3660eb17d04521c533f52651f9b6153', class: classes.classes(['zonos--elements', this.isMobile && 'mobile']) }, index.h("div", { key: '90b473ca63321395e9fceb48b8d21d90b225c01f', class: "zonos--checkout-footer" }, index.h("div", { key: '4cd4d63838aae1c26df2b3513cb24f93a497705b', class: "zonos--checkout-locale-wrapper" }, index.h("zonos-button", { key: '2db346594fdf00329a8f4887c4d431ddedc22e40', buttonColor: colorDesktop, class: "zonos--checkout-footer-language-button", icon: index.h("zonos-icon", { "aria-label": "Language select", content: Globe, iconColor: colorDesktop }), onClick: () => this.toggleLanguageDialog(), variant: "subtle" }, index.h("span", { key: '55332b4a8d812976333a9f14853d63c94fc2d3b4', class: "zonos--checkout-locale-label" }, languageLabel, index.h("zonos-icon", { key: '1c27c4b559974ebbcff5470d6fb7a2ace3e204c2', "aria-hidden": "true", class: "zonos--checkout-locale-chevron", content: ChevronDownIcon$1, iconColor: colorDesktop, size: 18 }))), index.h("div", { key: '5e87976476c7fb124c308352587643b009bda3df', class: classes.classes([
+        return (index.h(index.Host, { key: 'edf9d7cfd7375fcd4f335caedccc2928f84a594e', class: classes.classes(['zonos--elements', this.isMobile && 'mobile']) }, index.h("div", { key: '14f359b70f1f4610be37571ae5d32ae7791be012', class: "zonos--checkout-footer" }, index.h("div", { key: 'ae803331487f9759403633a8e27cc6e480b40f93', class: "zonos--checkout-locale-wrapper" }, index.h("zonos-button", { key: 'f173841a4c1b3af79a2c21ad9195b509f2891964', buttonColor: colorDesktop, class: "zonos--checkout-footer-language-button", icon: index.h("zonos-icon", { "aria-label": "Language select", content: Globe, iconColor: colorDesktop }), onClick: () => this.toggleLanguageDialog(), variant: "subtle" }, index.h("span", { key: '7148d2a6076b786954cb9a02e41c760ba4719d6b', class: "zonos--checkout-locale-label" }, languageLabel, index.h("zonos-icon", { key: '0a759d42576bf657893e6e2349cc3938855de6fc', "aria-hidden": "true", class: "zonos--checkout-locale-chevron", content: ChevronDownIcon$1, iconColor: colorDesktop, size: 18 }))), index.h("div", { key: '63b1ac3440c35349341272b051c4a3e04e19f818', class: classes.classes([
                 'zonos--checkout-footer-dialog',
                 this.showLanguageDialog && 'zonos--checkout-footer-dialog-open',
-            ]) }, index.h("zonos-language-select", { key: '3ab16dc27d046bd8a0ebab4fd44ba0a10b53b0a5', handleOnClose: () => this.toggleLanguageDialog() }))), index.h("div", { key: '3d7e9500d281348acb8f6c64f7a792b0248b5347', class: "zonos--checkout-footer-icon-wrapper" }, index.h("a", { key: '8b2ba4f4d0e962d94e24b08e69ad53310050049b', href: "https://zonos.com/docs/legal/zonos-privacy-policy", rel: "noopener noreferrer", target: "_blank" }, index.h("zonos-text", { key: '06c700777036ef3e15b2f8586e96ccb020f06850', textColor: colorDesktop }, localization.translate('Privacy policy'))), index.h("div", { key: '1af786991ea239d2b40a43de0e5b872350f8e171', class: "zonos--checkout-footer-logo" }, index.h("zonos-text", { key: '889819449f802936510bda4f21b1233e76853613', textColor: colorDesktop }, localization.translate('Powered by')), index.h("a", { key: '1d2f3f924b78e4e8b37b1504e37a2cdb0b0bfb9b', href: "https://zonos.com", rel: "noopener noreferrer", target: "_blank", title: "Zonos website" }, index.h("zonos-icon", { key: '2429284234ffcb51ecff0fd3a98f88bbe8c4c1c5', autoHeight: true, content: colorDesktop === 'gray-1000'
+            ]) }, index.h("zonos-language-select", { key: '5cad0220d288b722355715c5418928f065af07c1', handleOnClose: () => this.toggleLanguageDialog() }))), index.h("div", { key: '30ec30fd80133525889fea8ab0567179f3ffdd3a', class: "zonos--checkout-footer-icon-wrapper" }, index.h("a", { key: 'a6900165737de98bed8fee21d88b4e269ad209e3', href: "https://zonos.com/docs/legal/zonos-privacy-policy", rel: "noopener noreferrer", target: "_blank" }, index.h("zonos-text", { key: 'ca88bc63b702dcb651530f41aee4764734a5ee84', textColor: colorDesktop }, localization.translate('Privacy policy'))), index.h("div", { key: '8caa023f3aca229e464a27f55c289985114cc641', class: "zonos--checkout-footer-logo" }, index.h("zonos-text", { key: '9a3b6097c157dd86bd8a03c41887915051852930', textColor: colorDesktop }, localization.translate('Powered by')), index.h("a", { key: '5e0657c052e71ce12c5717b8a5473e4fc5ca2926', href: "https://zonos.com", rel: "noopener noreferrer", target: "_blank", title: "Zonos website" }, index.h("zonos-icon", { key: '1c6a13757a62a14a9898b3de06aaa1f717f3035d', autoHeight: true, content: colorDesktop === 'gray-1000'
                 ? ZonosIconLight
                 : ZonosIconDark, size: 108 })))))));
     }
@@ -1069,6 +1069,114 @@ const ZonosCheckoutFooter = class {
 };
 ZonosCheckoutFooter.style = ZonosCheckoutFooterStyle0;
 
+/**
+ * Caches live "configured currency → presentment currency" rates used to convert
+ * the EU withdrawal return-shipping cap into the currency the buyer actually pays
+ * in. A @stencil/store so that, when a lazily-fetched rate resolves, components
+ * rendering the notice re-render and pick up the converted amount. Keyed by
+ * `${sourceCurrency}_${targetCurrency}`; a null value means the lookup failed.
+ */
+const { state: euWithdrawalRateStore } = zonosStore.createStore({ crossRates: {} });
+// Tracks in-flight rate lookups so the same pair isn't fetched on every render.
+const inFlightRateKeys = new Set();
+const euWithdrawalCrossRateKey = (sourceCurrency, targetCurrency) => `${sourceCurrency}_${targetCurrency}`;
+/**
+ * Lazily fetch the current configured→presentment rate (fire-and-forget). Guarded
+ * so each pair is fetched at most once; the result lands in the reactive store,
+ * which triggers a re-render that then shows the presentment estimate.
+ */
+const ensureEuWithdrawalCrossRate = (sourceCurrency, targetCurrency, shipToCountry) => {
+    const key = euWithdrawalCrossRateKey(sourceCurrency, targetCurrency);
+    if (inFlightRateKeys.has(key) ||
+        euWithdrawalRateStore.crossRates[key] !== undefined) {
+        return;
+    }
+    inFlightRateKeys.add(key);
+    void localization.getExchangeRate({
+        country: shipToCountry,
+        isGuaranteed: false,
+        sourceCurrency,
+        targetCurrency,
+    })
+        .then(({ exchangeRate }) => {
+        var _a;
+        euWithdrawalRateStore.crossRates = Object.assign(Object.assign({}, euWithdrawalRateStore.crossRates), { [key]: (_a = exchangeRate === null || exchangeRate === void 0 ? void 0 : exchangeRate.rate) !== null && _a !== void 0 ? _a : null });
+    })
+        .finally(() => {
+        inFlightRateKeys.delete(key);
+    });
+};
+
+/**
+ * Returns the cap converted into the presentment currency, or null when it can't
+ * be determined yet (rate still loading or unavailable).
+ *
+ * - When the cap currency is the merchant's native/base currency, reuse the
+ *   checkout session's base→presentment rate (no extra request).
+ * - Otherwise fetch the current cap-currency→presentment rate on demand.
+ */
+const getPresentmentAmount = (maximum, configuredCurrency, presentmentCurrency, shipToCountry) => {
+    var _a, _b;
+    const baseCurrency = (_a = cart.cartStore.exchangeRate) === null || _a === void 0 ? void 0 : _a.sourceCurrencyCode;
+    const sessionRate = (_b = cart.cartStore.exchangeRate) === null || _b === void 0 ? void 0 : _b.rate;
+    if (configuredCurrency === baseCurrency && sessionRate) {
+        return maximum * sessionRate;
+    }
+    const liveRate = euWithdrawalRateStore.crossRates[euWithdrawalCrossRateKey(configuredCurrency, presentmentCurrency)];
+    if (liveRate === undefined) {
+        ensureEuWithdrawalCrossRate(configuredCurrency, presentmentCurrency, shipToCountry);
+        return null;
+    }
+    return liveRate === null ? null : maximum * liveRate;
+};
+const formatInCurrency = (amount, currency) => `${localization.numberFormat({ amount, currency, targetFormat: null })} ${currency}`;
+/**
+ * Formats the cap for the buyer, e.g. "100 USD (~125 CAD)" — the merchant's
+ * configured amount/currency, plus the estimated amount the buyer will actually
+ * pay in their presentment currency. When the cap is already in the presentment
+ * currency, or the presentment estimate isn't available yet, only the configured
+ * amount is shown.
+ */
+const formatMaximum = (maximum, configuredCurrency, shipToCountry) => {
+    const configured = formatInCurrency(maximum, configuredCurrency);
+    const presentmentCurrency = cart.cartStore.currency;
+    if (configuredCurrency === presentmentCurrency) {
+        return configured;
+    }
+    const presentmentAmount = getPresentmentAmount(maximum, configuredCurrency, presentmentCurrency, shipToCountry);
+    if (presentmentAmount == null) {
+        return configured;
+    }
+    return `${configured} (~${formatInCurrency(presentmentAmount, presentmentCurrency)})`;
+};
+/**
+ * Returns the localized EU withdrawal notice text to render above the Pay button,
+ * or null when it shouldn't be shown. The notice appears only when the merchant
+ * has opted in (status ENABLED) and the buyer is shipping to a country flagged by
+ * the API as affected by the regulation (`genericSettings.withdrawalCountryEnabled`).
+ * When a maximum return-shipping cap is configured the copy includes the amount;
+ * otherwise it uses the no-maximum variant.
+ */
+const getEuWithdrawalNoticeText = (shipToCountry) => {
+    var _a, _b;
+    const policy = (_a = zonosStore.zonosStore.checkoutSettings.merchantPolicyLinks) === null || _a === void 0 ? void 0 : _a.euWithdrawalPolicy;
+    if (!policy || policy.status !== 'ENABLED') {
+        return null;
+    }
+    // The affected-country list is API-controlled (not hardcoded), so an absent or
+    // empty list shows the notice for no country.
+    const enabledCountries = (_b = zonosStore.zonosStore.genericSettings) === null || _b === void 0 ? void 0 : _b.withdrawalCountryEnabled;
+    if (!shipToCountry ||
+        !(enabledCountries === null || enabledCountries === void 0 ? void 0 : enabledCountries.some(country => country === shipToCountry))) {
+        return null;
+    }
+    const maximum = policy.maximumReturnShippingEstimate;
+    if (maximum == null) {
+        return localization.translate('If you later choose to exercise your right to withdrawal, you will be responsible for any associated return shipping costs.');
+    }
+    return localization.translate('If you later choose to exercise your right to withdrawal, you will be responsible for any associated return shipping costs, up to a maximum [amount].', { amount: formatMaximum(maximum, policy.currencyCode, shipToCountry) });
+};
+
 const CheckmarkLineIcon = `<svg color="var(--zonos-elements-gray-1000)" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="var(--zonos-elements-gray-1000)" d="M15.342 10.21a.75.75 0 0 0-1.184-.92l-2.978 3.829-1.4-1.4a.75.75 0 1 0-1.06 1.061l1.8 1.8a1 1 0 0 0 1.496-.093l3.326-4.277Z"/><path fill="var(--zonos-elements-gray-1000)" fill-rule="evenodd" d="M12 4a8 8 0 1 0 0 16 8 8 0 0 0 0-16Zm-6.5 8a6.5 6.5 0 1 1 13 0 6.5 6.5 0 0 1-13 0Z" clip-rule="evenodd"/></svg>`;
 
 const RemoveLineIcon = `<svg color="var(--zonos-elements-gray-1000)" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="var(--zonos-elements-gray-1000)" d="M14.475 10.586a.75.75 0 1 0-1.06-1.06L12 10.938l-1.414-1.414a.75.75 0 0 0-1.06 1.06L10.938 12l-1.414 1.414a.75.75 0 1 0 1.06 1.06L12 13.062l1.414 1.414a.75.75 0 0 0 1.06-1.06L13.062 12l1.414-1.414Z"/><path fill="var(--zonos-elements-gray-1000)" fill-rule="evenodd" d="M12 4a8 8 0 1 0 0 16 8 8 0 0 0 0-16Zm-6.5 8a6.5 6.5 0 1 1 13 0 6.5 6.5 0 0 1-13 0Z" clip-rule="evenodd"/></svg>`;
@@ -1263,6 +1371,7 @@ const ZonosCheckoutPayment = class {
         const isPaypalTabSelected = ((_a = cart.stripeStore.stripePaymentEventData) === null || _a === void 0 ? void 0 : _a.value.type) === 'external_paypal';
         const storeCreditCoversFullOrder = cart.storeCreditStoreCoversFullAmount();
         const renderPayment = () => {
+            var _a;
             if (isStagingMode) {
                 const { colorPrimary } = zonosStore.zonosStore.appearance;
                 const themeBasedColor = colorPrimary && isDarkColor.isDarkColor(colorPrimary) ? 'DARK' : 'LIGHT';
@@ -1276,10 +1385,11 @@ const ZonosCheckoutPayment = class {
                     // use primary type when on mobile mode
                     variant: this.submitBtnType }, localization.translate('Place test order')))));
             }
+            const euWithdrawalNoticeText = getEuWithdrawalNoticeText((_a = cart.stripeStore.stripeAddressEventData) === null || _a === void 0 ? void 0 : _a.value.address.country);
             return (index.h(index.Fragment, null, this.showErrorBanner && (index.h("zonos-banner", { class: "zonos--error-banner", intent: "error" }, localization.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 ||
                 localization.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)), cart.cartStore.customerAuthenticationToken &&
                 cart.storeCreditStore.availableBalance != null &&
-                cart.storeCreditStore.availableBalance > 0 && (index.h("zonos-store-credit", null)), storeCreditCoversFullOrder ? (index.h("zonos-banner", { intent: "info" }, localization.translate('Store credit covers your full order'))) : (index.h("zonos-payment", null)), index.h("zonos-policy-consent", null), index.h("div", { class: "zonos--group-btn" }, (!isPaypalTabSelected || storeCreditCoversFullOrder) && (index.h(index.Fragment, null, index.h("zonos-button", { backgroundColor: this.submitBtnColor, bold: true, isDisabled: this.continueLoading &&
+                cart.storeCreditStore.availableBalance > 0 && (index.h("zonos-store-credit", null)), storeCreditCoversFullOrder ? (index.h("zonos-banner", { intent: "info" }, localization.translate('Store credit covers your full order'))) : (index.h("zonos-payment", null)), index.h("zonos-policy-consent", null), euWithdrawalNoticeText && (index.h("zonos-banner", { class: "zonos--eu-withdrawal-notice", intent: "info" }, euWithdrawalNoticeText)), index.h("div", { class: "zonos--group-btn" }, (!isPaypalTabSelected || storeCreditCoversFullOrder) && (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) {
@@ -1421,17 +1531,17 @@ const ZonosCheckoutProgressTabs = class {
                 color: labelSelectedColor,
             })
             : labelSelectedColor;
-        return (index.h(index.Host, { key: '2bc73268f4413887abe526ab1ac01471627e9fbc', class: "zonos--elements", style: {
+        return (index.h(index.Host, { key: 'e5c68ba81756351ca14ee7cecc1fc31070aea2f6', class: "zonos--elements", style: {
                 '--zonos--color': contrastLabelColor,
                 '--zonos--progress-percent': this.getTotalSuccessStep(),
-            } }, index.h("div", { key: 'fb812b9d4e6ba72f26b4f31ccf8444500a72f277', class: "zonos--tab-wrapper" }, Object.values(cart.cartStore.tabItems).map((tab, index$1) => {
+            } }, index.h("div", { key: '64c20db4eb660505af2e97c07e9658f9866cfd57', class: "zonos--tab-wrapper" }, Object.values(cart.cartStore.tabItems).map((tab, index$1) => {
             const isSelected = tab.value === selectedStep;
             return (index.h("button", { "aria-label": `Tab ${tab.label}`, class: classes.classes([
                     'zonos--tab-item',
                     tab.value === selectedStep && 'selected',
                     tab.isDone && 'done',
                 ]), disabled: !this.isTabClickable(tab.value), key: tab.value, onClick: () => this.setTabSelected(tab.value) }, index.h("div", { class: "zonos--tab-index" }, index.h("zonos-text", { class: "zonos--tab-index-label", textColor: isSelected ? contrastLabelColor : 'gray-1000', type: "label" }, index$1 + 1), index.h("zonos-icon", { class: "zonos--tab-index-done-icon", content: TabCheckmark, iconColor: isSelected ? contrastLabelColor : 'gray-1000' })), index.h("zonos-text", { textColor: isSelected ? contrastLabelColor : 'gray-1000', type: "label" }, localization.translate(tab.label))));
-        })), index.h("div", { key: '0dcaeb8d709f06df00b965c7aa081294a060120e', class: "zonos--tab-progress" }, index.h("div", { key: '8faef8257c4a0244e1ee5f3ac5752904ecd63d96', class: "zonos--progress-bar-fill" }))));
+        })), index.h("div", { key: 'e3257fb953c3c76e946a47334a16a2bd802ceb10', class: "zonos--tab-progress" }, index.h("div", { key: '2e8a3905cf361d1138846aa8f8153b92e80c5fca', class: "zonos--progress-bar-fill" }))));
     }
     static get assetsDirs() { return ["assets"]; }
     get ele() { return index.getElement(this); }
@@ -2144,11 +2254,11 @@ const ZonosRestState = class {
     }
     render() {
         const imageUrl = this.getImageRestState();
-        return (index.h(index.Host, { key: 'c8ad36ee240e6c623cfd950a9cd2eebc89e1d264', class: classes.classes(['zonos--elements zonos--restState']), style: {
+        return (index.h(index.Host, { key: '318c4da3d24faab9e2896923388183be1553fc39', class: classes.classes(['zonos--elements zonos--restState']), style: {
                 '--zonos--font-family': zonosStore.zonosStoreFontFamily(),
-            } }, index.h("div", { key: 'c1f45b4dfc584bd492f36cd678699aec372d0b41', class: "zonos--restState-image" }, index.h("img", { key: 'dbbcbfcdfb849c8f31c17eba4f99d2fbf1f9f05d', alt: this.restStateType, onError: () => {
+            } }, index.h("div", { key: '4a25dbfceb67d366ea68ebe0b16bd3af2f2073e6', class: "zonos--restState-image" }, index.h("img", { key: '5af2ffcf96d9ee70ceb14c6c16ad8607c5a734d8', alt: this.restStateType, onError: () => {
                 this.isErrorImageLoad = true;
-            }, src: imageUrl })), index.h("div", { key: 'a3f92d7c4b7c3d6b27b310024b60659903901300', class: "content" }, index.h("zonos-text", { key: 'c3f6af9cc17b95f988d848e18e3afbdb711c5ddd', class: "title", type: "boldSubheader" }, this.restStateTitle), index.h("zonos-text", { key: '656d089910ca5aa79b762d6c36b9b14ef093b706', class: "subtitle" }, this.restStateSubtitle)), index.h("div", { key: 'e44d6b8bdf04cc1bc31a3ed427260c08ab05781b', class: "action" }, index.h("slot", { key: '662fcf9da75d402dbfdd4ec8135c5112c5cc7527' }))));
+            }, src: imageUrl })), index.h("div", { key: 'c3c6c28e7edabc3f127f74a1f8025cdd556c2df1', class: "content" }, index.h("zonos-text", { key: '8fc1b63061c1c6ed1aaf7c8bf1f6d0107ad96574', class: "title", type: "boldSubheader" }, this.restStateTitle), index.h("zonos-text", { key: '8410ef232d219a27bedd6fab0f2145c242c21a6d', class: "subtitle" }, this.restStateSubtitle)), index.h("div", { key: 'f9d8cd4653bc3918b9c2c3bf453b17999e16972f', class: "action" }, index.h("slot", { key: '60091e060884958d729092292ae6c34f9af85ae1' }))));
     }
     static get assetsDirs() { return ["assets"]; }
 };

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

@@ -72,14 +72,14 @@ const ZonosCheckbox = class {
             customRoundRadius: '4px',
             overrideBorderStyle: this.borderStyle,
         });
-        return (index.h(index.Host, { key: '68ce8866560fc44b0f0ccdc2c62ce6f12662b732', class: classes.classes(['zonos--elements zonos--checkbox']), style: {
+        return (index.h(index.Host, { key: '2021966f1236912bd2970023fbc44165c7b6ed7c', class: classes.classes(['zonos--elements zonos--checkbox']), style: {
                 '--zonos--background-color': backgroundColor,
                 '--zonos--border-radius': borderStyle,
                 '--zonos--font-family': zonosStore.zonosStoreFontFamily(),
                 '--zonos--size': `${this.size}px`,
-            } }, index.h("label", { key: '296bc060857897219204b2f7c92f14fe95d9a4e0', class: classes.classes([this.isDisabled && 'disabled']), htmlFor: this.inputId }, index.h("input", { key: '0995da201de091b958f8a7e0aa8e160d3806c9df', checked: this.isChecked, disabled: this.isDisabled, hidden: true, id: this.inputId, onChange: e => {
+            } }, index.h("label", { key: 'b49919481676d8360a07d9cd456ce149559b9a09', class: classes.classes([this.isDisabled && 'disabled']), htmlFor: this.inputId }, index.h("input", { key: '5d3382b19c8f5207e5a505ff09248441969aa5c7', checked: this.isChecked, disabled: this.isDisabled, hidden: true, id: this.inputId, onChange: e => {
                 this.checkboxSelected.emit(e.target.checked);
-            }, type: "checkbox" }), index.h("span", { key: '9ea1f4c9e4eecf9ac151d10318fcdec7e3a242e2', class: "checkmark-container" }, index.h("svg", { key: '56a08834db133070b05d00c95017ed2e35a27d7f', class: "checkmark", color: checkmarkColor, fill: "none", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'c137dbb9448ca58d7080b48f7e8e0ca0ce534ef9', "clip-rule": "evenodd", d: "M17.456 7.404a.75.75 0 0 1 .14 1.052l-6.5 8.5a.75.75 0 0 1-1.126.074l-4-4a.75.75 0 0 1 1.06-1.06l3.395 3.394 5.98-7.82a.75.75 0 0 1 1.05-.14Z", fill: "currentColor", "fill-rule": "evenodd" }))), this.label && (index.h("zonos-text", { key: 'bdff3daf6e88591d3af0567c74569608e6dabb4e', size: this.fontSize }, this.label)))));
+            }, type: "checkbox" }), index.h("span", { key: 'fc35e3d6c1a3380b8f2b012951b5cf50e42e9735', class: "checkmark-container" }, index.h("svg", { key: 'c134d6444c50ff2294c7685f2a3ed52a6ef070b6', class: "checkmark", color: checkmarkColor, fill: "none", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '635394bdaa83c0d222f995a805128b3ccfae71a0', "clip-rule": "evenodd", d: "M17.456 7.404a.75.75 0 0 1 .14 1.052l-6.5 8.5a.75.75 0 0 1-1.126.074l-4-4a.75.75 0 0 1 1.06-1.06l3.395 3.394 5.98-7.82a.75.75 0 0 1 1.05-.14Z", fill: "currentColor", "fill-rule": "evenodd" }))), this.label && (index.h("zonos-text", { key: '0626598dc95151a065a615ffaf99fd59030d2a29', size: this.fontSize }, this.label)))));
     }
 };
 ZonosCheckbox.style = ZonosCheckboxStyle0;
@@ -97,9 +97,9 @@ const ZonosToggle = class {
         this.options = [];
     }
     render() {
-        return (index.h(index.Host, { key: 'a69d1282e442b2cc5b24df68ee41c452b02fb022', class: classes.classes(['zonos--elements zonos--toggle']), style: {
+        return (index.h(index.Host, { key: 'cdc4d67f72773fa460d24cfc0a24fcb5288f40ad', class: classes.classes(['zonos--elements zonos--toggle']), style: {
                 '--zonos--font-family': zonosStore.zonosStoreFontFamily(),
-            } }, index.h("div", { key: 'a0fff3107e8d9a98d3ff323379c6e39bee294eca', class: "wrapper" }, this.options.map(option => {
+            } }, index.h("div", { key: '2eb725addb5f65b98edd5193ceb6eaaa2564952b', class: "wrapper" }, this.options.map(option => {
             const selected = option.value === this.value;
             return (index.h("button", { class: classes.classes(['zonos--option', selected && 'selected']), key: option.value, onClick: () => {
                     this.toggleChanged.emit(option.value);

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

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const cart = require('./cart-3ff48a0e.js');
-const paypal = require('./paypal-c55b6c45.js');
-const localization = require('./localization-5c1c9c6a.js');
+const cart = require('./cart-660e115c.js');
+const paypal = require('./paypal-125259ab.js');
+const localization = require('./localization-f4a64f6f.js');
 const zonosStore = require('./zonosStore-45a87908.js');
 const buildCartItemsByTempCart = require('./buildCartItemsByTempCart-edddbf4b.js');
 const handleFetch = require('./handleFetch-954f30e1.js');

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

@@ -57,10 +57,10 @@ const ZonosCollapse = class {
             // set overflow to hidden to prevent content from showing when collapsed
             this.el.style.overflow = 'hidden';
         }
-        return (index.h(index.Host, { key: '4266c0d5399bbcecf4725cfda02ee88fb3b74843', class: 'zonos--elements zonos--collapse', style: {
+        return (index.h(index.Host, { key: '9a7c1c2e4f960e34fa81af1ce3bc509857082a27', class: 'zonos--elements zonos--collapse', style: {
                 '--zonos--font-family': zonosStore.zonosStoreFontFamily(),
                 height: this.getElementHeight(),
-            } }, index.h("div", { key: 'ca2fb1d9b821402ff26e171f678083d60b401a22' }, index.h("iframe", { key: 'ba726164295930bba21d115b732a7bd2edad18e0', class: "height-change-listener", tabindex: "-1", title: "collapse-height-change-listener" }), index.h("slot", { key: '1454a6f84d2e90be4b79868c99dfefdb21baf9d9' }))));
+            } }, index.h("div", { key: 'e68bac246e123eaf18d3b0a47c38b60ddd9c297a' }, index.h("iframe", { key: '011961e0e1608ba664ba366a16347c843d4280b3', class: "height-change-listener", tabindex: "-1", title: "collapse-height-change-listener" }), index.h("slot", { key: '8234271563b9a56b8507374e4aa9881ae8f699ba' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/zonos-collect-cart-items_3.cjs.entry.js

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const cart = require('./cart-3ff48a0e.js');
+const cart = require('./cart-660e115c.js');
 const cleanHtmlMarkdown = require('./cleanHtmlMarkdown-31da84b7.js');
 const zonosStore = require('./zonosStore-45a87908.js');
 const classes = require('./classes-b7918f56.js');
 const styles = require('./styles-d1e64fb9.js');
-require('./localization-5c1c9c6a.js');
+require('./localization-f4a64f6f.js');
 require('./handleFetch-954f30e1.js');
 require('./VarianceTest-bec00ea8.js');
 require('./isDarkColor-5d6ca405.js');
@@ -25,7 +25,7 @@ const ZonosCollectCartItems = class {
     render() {
         const emptyItemImg = index.getAssetPath('./assets/empty-item.jpeg');
         const nonRestrictedItems = cart.cartStore.items.filter(item => !item.isRestricted);
-        return (index.h(index.Host, { key: '085e4b2fd45b68d916f268719cb52009cc06f8a2', class: "zonos--collect-cart-items zonos--elements" }, index.h("table", { key: '23338d49319259769cd139ff9c329f3a9c6a059a', class: "zonos--cart-table" }, index.h("tbody", { key: '9a8ba11598f20b78a0ea199ccdf7254db461a0ac' }, nonRestrictedItems.map(item => {
+        return (index.h(index.Host, { key: 'b59fc5d56e5672ed47312fa930a1f35bf987b58d', class: "zonos--collect-cart-items zonos--elements" }, index.h("table", { key: '1f1020fd843fc2e86a12f426786f275e2c45c7c6', class: "zonos--cart-table" }, index.h("tbody", { key: 'b383812ea0967e3715701c09753fda8b3dbfe612' }, nonRestrictedItems.map(item => {
             const itemImg = item.imageUrl;
             const cleanedItemNames = cleanHtmlMarkdown.cleanHtmlMarkdown(item.name);
             return (index.h("tr", { class: "zonos--collect-cart-item" }, index.h("td", { class: "zonos--column zonos--cart-item-image" }, itemImg && !this.errorImages.includes(itemImg) ? (index.h("img", { alt: item.name, onError: () => {
@@ -52,10 +52,10 @@ const HStack = class {
         this.spacing = 24;
     }
     render() {
-        return (index.h(index.Host, { key: '721c4dd7d467879b21078725e6343b7ee8d76675', style: {
+        return (index.h(index.Host, { key: 'f06155d19be654e8af1f3fe31d8b90c9714803a1', style: {
                 '--spacing': `${this.spacing}px`,
                 '--zonos--font-family': zonosStore.zonosStoreFontFamily(),
-            } }, index.h("slot", { key: '1e4dc26d7e61893d04bc6255abf2834b4545b335' })));
+            } }, index.h("slot", { key: '6cfa7de515d78cc8376e9c863e54e6875392bd0a' })));
     }
 };
 HStack.style = ZonosHStackStyle0;
@@ -78,7 +78,7 @@ const ZonosSkeleton = class {
         this.skeletonHeight = '14px';
     }
     render() {
-        return (index.h(index.Host, { key: '22a28005143f47dd80eaec233e7d9937d7e72507', class: classes.classes(['zonos--elements zonos--skeleton']), style: styles.styles({
+        return (index.h(index.Host, { key: '58a2bedd58be3710e9e769efda15097c3ba19ea8', class: classes.classes(['zonos--elements zonos--skeleton']), style: styles.styles({
                 '--zonos--skeleton-height': this.skeletonHeight,
                 '--zonos--skeleton-width': this.skeletonWidth,
             }) }));