@zonos/elements 1.3.7-alpha.0 → 1.3.7-alpha.1

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-72767498.js');
-const zonosStore = require('./zonosStore-49d4c92a.js');
+const zonosStore = require('./zonosStore-138c5555.js');
 const classes = require('./classes-b7918f56.js');
 
 const zonosLogoCss = ":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 img{-webkit-filter:var(--filter-color);filter:var(--filter-color);width:var(--width)}";
@@ -19,11 +19,11 @@ const ZonosLogo = class {
         const filterColor = this.theme === 'DARK'
             ? 'invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%)'
             : 'whiteinvert(0%) sepia(100%) saturate(32%) hue-rotate(92deg) brightness(107%) contrast(107%)';
-        return (index.h(index.Host, { key: '5e97dd0219dde036eef02757f055354390b18c3d', class: classes.classes(['zonos--elements zonos--logo']), style: {
+        return (index.h(index.Host, { key: 'b93db6ec62ecaacb3ded0ab07dd2f38ed488f8d1', class: classes.classes(['zonos--elements zonos--logo']), style: {
                 '--filter-color': filterColor,
                 '--font-family': zonosStore.zonosStoreFontFamily(),
                 '--width': this.width,
-            } }, index.h("img", { key: '44c720d0a7bf3cf5a6bd783f21c8493d3a53ec70', alt: "Zonos Logo", src: index.getAssetPath('./assets/ZonosLogo.png') })));
+            } }, index.h("img", { key: '026162477b24250e4204318fa3018b1cfd383ab5', alt: "Zonos Logo", src: index.getAssetPath('./assets/ZonosLogo.png') })));
     }
     static get assetsDirs() { return ["assets"]; }
 };

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-72767498.js');
-const zonosStore = require('./zonosStore-49d4c92a.js');
+const zonosStore = require('./zonosStore-138c5555.js');
 const classes = require('./classes-b7918f56.js');
 
 const zonosNotificationCss = ":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-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}:host .zonos--notification-items{position:fixed;z-index:9999999;bottom:var(--amino-space-24);gap:var(--amino-space-8);display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column}:host .zonos--notification-item{cursor:pointer;-webkit-transition:all 0.3s ease;transition:all 0.3s ease;padding:var(--amino-space-8);border-radius:var(--border-radius, var(--amino-radius-6));opacity:0;-ms-flex-negative:0.0001;flex-shrink:0.0001;-webkit-transform:translateY(100%);transform:translateY(100%)}:host .zonos--notification-item+:host .zonos--notification-item{margin-top:8px}:host .zonos--notification-item.show{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);-ms-flex-positive:1000;flex-grow:1000}:host .zonos--notification-item.success{background-color:var(--amino-green-700)}:host .zonos--notification-item.error{background-color:var(--amino-red-700)}:host .zonos--notification-item.warning{background-color:var(--amino-orange-700)}";

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

@@ -3,10 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-72767498.js');
-const cart = require('./cart-ecc80eb0.js');
-require('./zonosStore-49d4c92a.js');
-require('./isDarkColor-924e6a7a.js');
-require('./getBorderRadius-834c321d.js');
+const cart = require('./cart-89d9fff4.js');
+require('./zonosStore-138c5555.js');
+require('./isDarkColor-57860b44.js');
+require('./getBorderRadius-d8f18958.js');
 
 const zonosPaymentCss = ".sc-zonos-payment-h{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-payment-h *.sc-zonos-payment{font-family:var(--font-family, Inter), Inter}.sc-zonos-payment-h img.sc-zonos-payment{max-width:100%}.sc-zonos-payment-h dl.sc-zonos-payment,.sc-zonos-payment-h dd.sc-zonos-payment,.sc-zonos-payment-h h1.sc-zonos-payment,.sc-zonos-payment-h h2.sc-zonos-payment,.sc-zonos-payment-h h3.sc-zonos-payment,.sc-zonos-payment-h h4.sc-zonos-payment,.sc-zonos-payment-h h5.sc-zonos-payment,.sc-zonos-payment-h h6.sc-zonos-payment,.sc-zonos-payment-h hr.sc-zonos-payment,.sc-zonos-payment-h figure.sc-zonos-payment,.sc-zonos-payment-h p.sc-zonos-payment,.sc-zonos-payment-h pre.sc-zonos-payment{margin:0}.sc-zonos-payment-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-payment-h .zonos--title.sc-zonos-payment{margin-bottom:var(--amino-space-16)}";
 const ZonosPaymentStyle0 = zonosPaymentCss;
@@ -45,7 +45,7 @@ const ZonosPayment = class {
     }
     render() {
         // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here
-        return (index.h(index.Host, { key: 'd5b7717fa4b80da99ae6ba2d7cccbe318e091f8f', class: "zonos--payment zonos--elements" }, this.titleText && (index.h("zonos-text", { class: "zonos--title", type: "semiBoldLabel" }, this.titleText)), index.h("div", { key: '37bd2c2dcc59613857b9fd22d864c0d11b2a7319', class: "zonos--payment-component" })));
+        return (index.h(index.Host, { key: 'de560f2de1e48fce2cf11f0fc3e2ef36938e719f', class: "zonos--payment zonos--elements" }, this.titleText && (index.h("zonos-text", { class: "zonos--title", type: "semiBoldLabel" }, this.titleText)), index.h("div", { key: 'b6a60c127e67e3d03408d960ad56f712a5677683', class: "zonos--payment-component" })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/zonos-select-dialog-header_2.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-72767498.js');
-const zonosStore = require('./zonosStore-49d4c92a.js');
+const zonosStore = require('./zonosStore-138c5555.js');
 const classes = require('./classes-b7918f56.js');
 
 const RemoveIcon = `<svg xmlns="https://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#C5C6CA" fill-rule="evenodd" d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z" clip-rule="evenodd"/><path fill="#4D505A" fill-rule="evenodd" d="M8.293 8.293a1 1 0 0 1 1.414 0L12 10.586l2.293-2.293a1 1 0 1 1 1.414 1.414L13.414 12l2.293 2.293a1 1 0 0 1-1.414 1.414L12 13.414l-2.293 2.293a1 1 0 0 1-1.414-1.414L10.586 12 8.293 9.707a1 1 0 0 1 0-1.414Z" clip-rule="evenodd"/></svg>`;
@@ -18,9 +18,9 @@ const ZonosSelectDialogHeader = class {
         this.label = '';
     }
     render() {
-        return (index.h(index.Host, { key: '737dcae414b2538bf4c0b5c932a78acb9eeb1e93', class: "zonos--elements", style: {
+        return (index.h(index.Host, { key: 'd0882c22934d6f9635bd0b31af5703283cd0a1be', class: "zonos--elements", style: {
                 '--font-family': zonosStore.zonosStoreFontFamily(),
-            } }, index.h("zonos-v-stack", { key: '8cfde0f03e03ad011c8f8f4517c3b47ba8c03746', class: "zonos--select-dialog-header-wrapper", spacing: 8 }, index.h("div", { key: '5c5044ad46e156ad4cde26df0bb57c6690a11e42', class: "zonos--select-dialog-header" }, index.h("zonos-text", { key: 'a10b9b48834c6eabd9d20f44b8c8dc4927d53bd1', type: "boldLabel" }, this.label), index.h("zonos-button", { key: '50d74c5e97f2c224a437fde48b6d2a30b14fc1fe', class: "zonos--close-button", icon: index.h("zonos-icon", { "aria-label": "Close select dialog", content: RemoveIcon, size: 20 }), noBackground: true, onClick: () => this.handleOnClose() })), index.h("slot", { key: 'd875d9cfddaf37f1ca0a2bb01a3ba3da10c2fda0' }))));
+            } }, index.h("zonos-v-stack", { key: '2e227c5bdeeeb0fa772847267007df5aea2e0824', class: "zonos--select-dialog-header-wrapper", spacing: 8 }, index.h("div", { key: 'c43b72c938069ff1a99a985b3b388a785f94d100', class: "zonos--select-dialog-header" }, index.h("zonos-text", { key: 'b1008e43ca022ca1e1b63a60ab5c347d1228396e', type: "boldLabel" }, this.label), index.h("zonos-button", { key: '4722586c58eac765ded4a7baeeca8eb58d44dd0a', class: "zonos--close-button", icon: index.h("zonos-icon", { "aria-label": "Close select dialog", content: RemoveIcon, size: 20 }), noBackground: true, onClick: () => this.handleOnClose() })), index.h("slot", { key: '36babf745ea5de00c82823520134b1dfcfc9d16d' }))));
     }
 };
 ZonosSelectDialogHeader.style = ZonosSelectDialogHeaderStyle0;
@@ -34,9 +34,9 @@ const VStack = class {
         this.spacing = 24;
     }
     render() {
-        return (index.h(index.Host, { key: 'a26c7c4898b81deb569731adb63505ded3155fdf', style: {
+        return (index.h(index.Host, { key: 'a5d1a84d5b25d1a49abec676731eaf76f703e998', style: {
                 '--font-family': zonosStore.zonosStoreFontFamily(),
-            } }, index.h("div", { key: 'd4af21dc024bbd12b5240dff4f2689416ad4d808', class: classes.classes(['vstack']), style: { 'grid-row-gap': `${this.spacing}px` } }, index.h("slot", { key: '298de42d875520fad5a720eedcf2b8664b39ae85' }))));
+            } }, index.h("div", { key: '456c8e1865a752dd258989888c45dfbdfd2c4f66', class: classes.classes(['vstack']), style: { 'grid-row-gap': `${this.spacing}px` } }, index.h("slot", { key: '2d3260c6b74d3def822acb98733f70a97a79f3fa' }))));
     }
 };
 VStack.style = ZonosVStackStyle0;

package/dist/cjs/zonos-shipping-rich-radio.cjs.entry.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-72767498.js');
-const zonosStore = require('./zonosStore-49d4c92a.js');
+const zonosStore = require('./zonosStore-138c5555.js');
 const classes = require('./classes-b7918f56.js');
-const getBorderRadius = require('./getBorderRadius-834c321d.js');
+const getBorderRadius = require('./getBorderRadius-d8f18958.js');
 const isColorVariable = require('./isColorVariable-41cacd82.js');
 
 const zonosShippingRichRadioCss = ":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-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host input{margin:0;accent-color:var(--selected-border-color, var(--amino-blue-600))}:host .zonos--shipping-rich-radio-item{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;padding:var(--amino-space-16);-ms-flex-align:center;align-items:center;gap:var(--amino-space-16);cursor:pointer;border:1px solid var(--amino-gray-200)}:host .zonos--shipping-rich-radio-item:first-child{border-top-left-radius:var(--border-radius, var(--amino-radius-10));border-top-right-radius:var(--border-radius, var(--amino-radius-10))}:host .zonos--shipping-rich-radio-item:last-child{border-bottom-right-radius:var(--border-radius, var(--amino-radius-10));border-bottom-left-radius:var(--border-radius, var(--amino-radius-10))}:host .zonos--shipping-rich-radio-item:not(:last-child){border-bottom:none}:host .zonos--shipping-rich-radio-item.selected{outline:1px solid var(--selected-border-color, var(--amino-blue-600));outline-offset:-1px}:host .zonos--shipping-info{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex:1;flex:1}:host .zonos--shipping-detail{-ms-flex:1;flex:1}:host .zonos--sub-detail{display:-ms-inline-flexbox;display:inline-flex;gap:8px;-ms-flex-wrap:wrap;flex-wrap:wrap}";
@@ -44,7 +44,7 @@ const ZonosShippingRichRadio = class {
             return (index.h("div", { "aria-hidden": "true", class: classes.classes([
                     'zonos--shipping-rich-radio-item',
                     selected && 'selected',
-                ]), onClick: () => this.handleRichRadioSelect(item) }, index.h("input", { checked: selected, class: "zonos--shipping-rich-radio-input", name: "zonos--shipping-rich-radio", type: "radio", value: item.value }), index.h("div", { class: "zonos--shipping-info" }, index.h("div", { class: "zonos--shipping-detail" }, index.h("zonos-text", { class: "zonos--shipping-label", type: "label" }, item.label), (item.sublabel || item.caption) && (index.h("div", { class: "zonos--sub-detail" }, item.sublabel && (index.h("zonos-text", { textColor: "gray-800" }, item.sublabel)), item.caption && (index.h("zonos-text", { textColor: "gray-400" }, item.caption))))), index.h("zonos-text", { type: "semiBoldLabel" }, item.price))));
+                ]), onClick: () => this.handleRichRadioSelect(item) }, index.h("input", { checked: selected, class: "zonos--shipping-rich-radio-input", name: "zonos--shipping-rich-radio", type: "radio", value: item.value }), index.h("div", { class: "zonos--shipping-info" }, index.h("div", { class: "zonos--shipping-detail" }, index.h("zonos-text", { class: "zonos--shipping-label", type: "label" }, item.label), (item.sublabel || item.caption) && (index.h("div", { class: "zonos--sub-detail" }, item.sublabel && (index.h("zonos-text", { textColor: "gray-800" }, item.sublabel)), item.caption && (index.h("zonos-text", { textColor: "gray-600" }, item.caption))))), index.h("zonos-text", { type: "semiBoldLabel" }, item.price))));
         })));
     }
 };

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-72767498.js');
-const zonosStore = require('./zonosStore-49d4c92a.js');
+const zonosStore = require('./zonosStore-138c5555.js');
 const classes = require('./classes-b7918f56.js');
 
 const textOptions = {

package/dist/cjs/{zonosStore-49d4c92a.js → zonosStore-138c5555.js}

@@ -2823,6 +2823,7 @@ const { reset, state: zonosStore } = createStore(() => ({
         restrictionBehavior: 'DISABLED',
     },
     loadedConfig: false,
+    organizationId: '',
     organizationName: '',
     sourceCurrency: 'USD',
     storeId: null,
@@ -2835,7 +2836,7 @@ let savedZonosSettings = null;
  * Init setting from zonos setting
  */
 const zonosStoreInitSetting = ({ overrideSettings, zonosSettings, }) => {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     reset();
     if (zonosSettings) {
         // save zonos settings to be used later
@@ -2850,8 +2851,9 @@ const zonosStoreInitSetting = ({ overrideSettings, zonosSettings, }) => {
     zonosStore.helloSettings = mergeConfig(zonosStore.helloSettings, (savedZonosSettings === null || savedZonosSettings === void 0 ? void 0 : savedZonosSettings.helloSettings) || (zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.helloSettings) || null, overrideSettings === null || overrideSettings === void 0 ? void 0 : overrideSettings.helloSettings);
     // set flag to true to indicate that config is ready
     zonosStore.loadedConfig = true;
-    zonosStore.organizationName = ((_a = zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.organization) === null || _a === void 0 ? void 0 : _a.name) || '';
-    zonosStore.storeId = ((_c = (_b = zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.organization) === null || _b === void 0 ? void 0 : _b.references) === null || _c === void 0 ? void 0 : _c.storeId) || null;
+    zonosStore.organizationId = ((_a = zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.organization) === null || _a === void 0 ? void 0 : _a.id) || '';
+    zonosStore.organizationName = ((_b = zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.organization) === null || _b === void 0 ? void 0 : _b.name) || '';
+    zonosStore.storeId = ((_d = (_c = zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.organization) === null || _c === void 0 ? void 0 : _c.references) === null || _d === void 0 ? void 0 : _d.storeId) || null;
     zonosStore.currencyConverter = overrideSettings === null || overrideSettings === void 0 ? void 0 : overrideSettings.currencyConverter;
 };
 const zonosStoreFontFamily = () => {

package/dist/collection/collection-manifest.json

@@ -13,6 +13,7 @@
     "components/checkout/zonos-checkout/zonos-customer-info/zonos-customer-info.js",
     "components/checkout/zonos-checkout/zonos-review/zonos-review.js",
     "components/checkout/zonos-checkout/zonos-shipping/zonos-shipping.js",
+    "components/common/component-template/zonos-link/zonos-link.js",
     "components/common/zonos-badge/zonos-badge.js",
     "components/common/zonos-button/zonos-button.js",
     "components/common/zonos-card/zonos-card.js",

package/dist/collection/components/checkout/zonos-checkout/zonos-cart-subtotal/zonos-cart-subtotal.js

@@ -7,7 +7,6 @@ import { formatCurrency } from "../../../utils/formatCurrency";
 import InfoIcon from "./assets/InfoIcon.svg";
 export class ZonosCartSubtotal {
     render() {
-        const totalWithoutTaxes = cartStore.total - cartStore.dutiesTaxFees;
         const showDutyTaxesInfo = cartStore.step === 'payment' || cartStore.step === 'shipping';
         const renderShippingInfo = () => {
             if (!cartStore.selectedShippingOption) {
@@ -29,11 +28,7 @@ export class ZonosCartSubtotal {
                 currency: cartStore.currency,
             })
             : '-', cartStore.isSelectedShippingGuarantee && (h("zonos-badge", null, translate('Guaranteed'))))))), h("tr", { class: "zonos--row zonos--cart-pay-total" }, h("td", { class: "zonos--column" }), h("td", { class: "zonos--column" }, h("zonos-text", { class: "zonos--title", type: "semiBoldLabel" }, translate('Order total'))), h("td", { class: "zonos--column" }, h("zonos-text", { type: "semiBoldLabel" }, formatCurrency({
-            amount: 
-            // show total without taxes when step is shipping, show total with taxes when step is payment
-            cartStore.step === 'shipping'
-                ? totalWithoutTaxes
-                : cartStore.total,
+            amount: cartStore.total,
             currency: cartStore.currency,
         })))))));
     }

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

@@ -3,8 +3,10 @@ import { cartStore } from "../../../store/checkout/cart";
 import { stripeStore, stripeStoreReset, stripeStoreRetrievePayment, } from "../../../store/checkout/stripe";
 import { translate } from "../../../store/translationStore";
 import { zonosStore } from "../../../store/zonosStore";
+import { trackConversionEvent } from "../../../utils/api/trackConversionEvent";
 import { getBorderRadius } from "../../../utils/getBorderRadius";
 import { handleFetch } from "../../../utils/handleFetch";
+import { sendErrorLog } from "../../../utils/logging/sendErrorLog";
 import { submitGtag } from "../../../utils/submitGtag";
 // eslint-disable-next-line no-relative-import-paths/no-relative-import-paths
 import RemoveIcon from "./assets/RemoveIcon.svg";
@@ -28,13 +30,17 @@ export class ZonosCheckoutFinish {
         this.handleSuccessBehavior = (orderId) => {
             const { successBehavior } = zonosStore.checkoutSettings;
             switch (successBehavior) {
-                case 'REDIRECT_TO_SUCCESS_PAGE':
+                case 'REDIRECT_TO_SUCCESS_PAGE': {
                     const redirectUrl = zonosStore.checkoutSettings.successRedirectUrl;
                     if (redirectUrl) {
+                        // reset store and checkout session id before redirecting
+                        stripeStoreReset();
+                        cartStore.checkoutSessionId = null;
                         window.location.href = `${redirectUrl}?zOrderNumber=${orderId}`;
                     }
                     // If no redirect URL, break and display Zonos success page
                     break;
+                }
                 case 'CLOSE_MODAL':
                     this.closeClickHandler();
                     break;
@@ -49,6 +55,7 @@ export class ZonosCheckoutFinish {
         this.getPullOrder = async (attempts = 0) => {
             const order = await this.pullOrder();
             if (order) {
+                void trackConversionEvent('checkout_orderCompleted');
                 this.order = order;
                 this.handleSuccessBehavior(order.id);
             }
@@ -60,18 +67,16 @@ export class ZonosCheckoutFinish {
             else {
                 // Set loading to false to display generic success page and log error
                 this.isLoading = false;
-                const errorObject = {
-                    endpoint: `${process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL}/api/zonos-elements/get-order`,
+                const baseUrl = process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL;
+                const checkoutSessionId = cartStore.checkoutSessionId;
+                void sendErrorLog({
+                    endpoint: `${baseUrl}/api/zonos-elements/get-order?checkoutSessionId=${checkoutSessionId}`,
                     errors: ['Order not found after multiple attempts'],
                     metadata: {
                         checkoutSessionId: cartStore.checkoutSessionId || '',
                         domain: window.location.hostname,
                         storeId: zonosStore.storeId,
                     },
-                };
-                void handleFetch(`${process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL}/api/zonos-elements/log-error`, {
-                    body: errorObject,
-                    method: 'POST',
                 });
             }
         };
@@ -79,7 +84,7 @@ export class ZonosCheckoutFinish {
             this.isLoading = true;
             const clientSecret = new URLSearchParams(window.location.search).get('payment_intent_client_secret') || stripeStore.clientSecret;
             if (clientSecret || this.storybookForceStatus) {
-                const { error, messages } = await stripeStoreRetrievePayment({
+                const { error, messages, paymentMethod } = await stripeStoreRetrievePayment({
                     clientSecret,
                     storybookForceStatus: this.storybookForceStatus,
                 });
@@ -93,6 +98,9 @@ export class ZonosCheckoutFinish {
                 }
                 else {
                     submitGtag('zonos-checkout-success');
+                    void trackConversionEvent('checkout_paymentInfoCompleted', {
+                        paymentMethod,
+                    });
                     const successEvent = new CustomEvent('zonos-checkout-success', {
                         detail: {
                             message: 'Zonos Checkout successfully processed order',
@@ -102,7 +110,8 @@ export class ZonosCheckoutFinish {
                 }
                 // Attempt to pull the order details from the graph every second on 5 attempts
                 if (this.notificationType === 'success') {
-                    void this.getPullOrder();
+                    // wait this to finish before resetting store and checkout session id
+                    await this.getPullOrder();
                 }
                 else {
                     this.isLoading = false;
@@ -145,7 +154,7 @@ export class ZonosCheckoutFinish {
         // const totalItems = this.order?.items?.reduce((acc, item) => {
         //   return acc + item.quantity;
         // }, 0);
-        return (h(Host, { key: '08886ec74e789091534c8bd6561a8349a5a6966c', class: "zonos--checkout-finish zonos--elements", style: {
+        return (h(Host, { key: 'fe08bfd0c0b60f4dce1aa9a6f3ba273dccd70a92', class: "zonos--checkout-finish zonos--elements", style: {
                 '--border-radius': getBorderRadius(this.borderRadius),
             } }, this.isLoading && (h("div", { class: "loading-wrapper" }, h("zonos-spinner", null))), !this.isLoading && (h(Fragment, null, h("div", { class: "zonos--group" }, this.notificationType === 'success' ? (h("zonos-icon", { "aria-label": "Order success", content: SuccessIcon, iconColor: 'blue-800', size: 50 })) : (h("zonos-icon", { "aria-label": "Order failed", content: RemoveIcon, iconColor: 'red-800', size: 50 })), h("zonos-text", { class: "zonos--title", type: "semiBoldSubheader" }, this.notificationTitle), h("zonos-text", null, this.notificationMessages.map(message => (h(Fragment, null, message, h("br", null))))), h("zonos-button", { onClick: () => this.closeClickHandler(), size: "md", variant: "primary" }, translate('Keep shopping')))))));
     }

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

@@ -62,6 +62,9 @@
 :host .zonos--payment-error-banner {
   margin-bottom: var(--amino-space-8);
 }
+:host zonos-button {
+  box-shadow: 0 0 1px 0 var(--amino-gray-600);
+}
 :host .zonos--group-btn {
   position: sticky;
   display: flex;

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

@@ -1,10 +1,13 @@
 import { Fragment, h, Host, } from "@stencil/core";
 import { cartStore, cartStoreNextStep, cartStorePreviousStep, cartStoreReset, cartStoreUpdateItems, cartStoreUpdateToErrorState, } from "../../store/checkout/cart";
-import { initStripeElements, stripeStore, stripeStoreConfirmPayment, stripeStoreInitCheckoutSession, stripeStorePrefetchLandedCost, stripeStoreReset, } from "../../store/checkout/stripe";
+import { initStripeElements, stripeStore, stripeStoreCleanupDomesticShippingSession, stripeStoreConfirmPayment, stripeStoreInitCheckoutSession, stripeStorePrefetchLandedCost, stripeStoreReset, } from "../../store/checkout/stripe";
 import { localizationStore } from "../../store/hello/localization";
 import { translate } from "../../store/translationStore";
 import { zonosStore, } from "../../store/zonosStore";
+import { trackConversionEvent } from "../../utils/api/trackConversionEvent";
 import { isCheckoutMobile } from "../../utils/checkout/isCheckoutMobile";
+import { isShippableCountry } from "../../utils/checkout/isShippableCountry";
+import { watchBigcommerceDomesticCheckout } from "../../utils/checkout/watchBigcommerceDomesticCheckout";
 import { classes } from "../../utils/classes";
 import { getBorderRadius } from "../../utils/getBorderRadius";
 import { isDarkColor } from "../../utils/isDarkColor";
@@ -31,19 +34,6 @@ export class ZonosCheckout {
                 overrideTheme: this.isMobile ? theme : undefined,
             });
         };
-        this.isShippableCountry = (showLog = true) => {
-            if (!localizationStore.localizationLoaded) {
-                return false;
-            }
-            // if localization is loaded and the localization is not a shippable country, keep the original click event
-            if (!localizationStore.isShippableCountry) {
-                if (showLog) {
-                    log(`Checkout: not shippable country`);
-                }
-                return false;
-            }
-            return true;
-        };
         this.getCurrentLocalePageEnum = () => {
             switch (cartStore.step) {
                 case 'customer-info':
@@ -70,6 +60,7 @@ export class ZonosCheckout {
         this.isMobile = false;
         this.zonosReviewRef = undefined;
         this.storybookPaymentStatusOverride = undefined;
+        this.domesticRedirectedBtnSelector = '#zonos--domestic-redirected-checkout-button';
     }
     /**
      * Init cart info handler event
@@ -115,7 +106,8 @@ export class ZonosCheckout {
             // do nothing if button element is not found
             return;
         }
-        const buttonAnchorElements = document.querySelectorAll(buttonAnchorSelector);
+        // also attach event to hidden button if user was redirected with shipping address session
+        const buttonAnchorElements = document.querySelectorAll(`${buttonAnchorSelector}, ${this.domesticRedirectedBtnSelector}`);
         // only attach event once, and looping through all of the button elements
         buttonAnchorElements.forEach(button => {
             const isEventAttached = button.getAttribute('data-zonos-checkout-attached');
@@ -125,7 +117,7 @@ export class ZonosCheckout {
             }
             button.addEventListener('click', async (e) => {
                 // do nothing if it's not shippable country
-                if (!this.isShippableCountry()) {
+                if (!isShippableCountry()) {
                     return;
                 }
                 e.preventDefault();
@@ -141,6 +133,7 @@ export class ZonosCheckout {
                         throw new Error('Error building cart');
                     }
                     submitGtag('zonos-checkout-start');
+                    void trackConversionEvent('checkout_open');
                 }
                 catch (err) {
                     // stop loading
@@ -155,6 +148,14 @@ export class ZonosCheckout {
             });
             button.removeAttribute('disabled');
             button.setAttribute('data-zonos-checkout-attached', 'true');
+            // if this button is the hidden button, trigger the click event
+            if (button.matches(this.domesticRedirectedBtnSelector)) {
+                button.dispatchEvent(new CustomEvent('click'));
+                // cleanup shipping session after button is clicked
+                stripeStoreCleanupDomesticShippingSession();
+                // remove the button after it's clicked
+                button.remove();
+            }
         });
     }
     appearanceSettingsOverrideChanged() {
@@ -170,6 +171,25 @@ export class ZonosCheckout {
     async init() {
         stripeStore.stripe = window.Zonos.stripe;
         this.stripe = window.Zonos.stripe;
+        // check if bigcommerce, if user enters the shipping address that's in the shipping zone at bigcommerce checkout
+        watchBigcommerceDomesticCheckout({
+            domesticRedirectedBtnSelector: this.domesticRedirectedBtnSelector,
+            onShippingAddressSessionFound: shippingAddressSession => {
+                // prefilled the default address if shipping address session is found for checkout on open
+                this.defaultAddress = {
+                    address: {
+                        city: shippingAddressSession.city,
+                        country: shippingAddressSession.countryCode,
+                        line1: shippingAddressSession.address1,
+                        line2: shippingAddressSession.address2,
+                        postal_code: shippingAddressSession.postalCode,
+                        state: shippingAddressSession.state,
+                    },
+                    name: `${shippingAddressSession.firstName} ${shippingAddressSession.lastName}`,
+                    phone: shippingAddressSession.phone,
+                };
+            },
+        });
         const hideInternationalOrderInterval = setInterval(() => {
             const internationalSelector = window.Zonos.internationalHideSelector;
             if (!internationalSelector) {
@@ -178,7 +198,7 @@ export class ZonosCheckout {
                 return;
             }
             // hide the selector if it's international
-            const isInternationalOrder = this.isShippableCountry(false);
+            const isInternationalOrder = isShippableCountry(false);
             const selector = document.querySelectorAll(internationalSelector);
             if (!isInternationalOrder) {
                 // show the selector when it's domestic
@@ -507,7 +527,8 @@ export class ZonosCheckout {
             "isAttachError": {},
             "isMobile": {},
             "zonosReviewRef": {},
-            "storybookPaymentStatusOverride": {}
+            "storybookPaymentStatusOverride": {},
+            "domesticRedirectedBtnSelector": {}
         };
     }
     static get methods() {

package/dist/collection/components/checkout/zonos-checkout/zonos-customer-info/zonos-customer-info.css

@@ -51,6 +51,9 @@
 :host .zonos--checkbox + .zonos--address {
   margin-bottom: 0;
 }
+:host zonos-button {
+  box-shadow: 0 0 1px 0 var(--amino-gray-600);
+}
 :host .zonos--group {
   margin-bottom: var(--amino-space-20);
   overflow: auto;

package/dist/collection/components/checkout/zonos-checkout/zonos-customer-info/zonos-customer-info.js

@@ -1,6 +1,7 @@
 import { h, Host, } from "@stencil/core";
 import { stripeStore, } from "../../../store/checkout/stripe";
 import { translate } from "../../../store/translationStore";
+import { trackConversionEvent } from "../../../utils/api/trackConversionEvent";
 import { submitGtag } from "../../../utils/submitGtag";
 export class ZonosCustomerInfo {
     constructor() {
@@ -20,6 +21,7 @@ export class ZonosCustomerInfo {
         if (!this.disabled) {
             // submit google tag when the form is complete
             submitGtag('zonos-checkout-customer-info');
+            void trackConversionEvent('checkout_customerInfoCompleted');
         }
     }
     render() {

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

@@ -28,7 +28,6 @@ export class ZonosReview {
             ? 'boldSubheader'
             : 'secondaryPageHeader';
         const titleTextColor = this.isMobile ? 'gray-1200' : 'gray-800';
-        const totalWithoutTaxes = cartStore.total - cartStore.dutiesTaxFees;
         const renderCollapseIcon = () => {
             // only display the collapse icon if the component is being rendered with mobile styles
             if (!this.isMobile) {
@@ -43,11 +42,7 @@ export class ZonosReview {
                 'zonos--review zonos--elements',
                 this.isMobile && 'mobile',
             ]) }, h("div", { class: "zonos--title" }, h("zonos-text", { textColor: titleTextColor, type: titleTextType }, translate('Pay'), " ", zonosStore.organizationName), renderCollapseIcon()), h("div", { class: "zonos--total-pay" }, h("zonos-text", { type: totalTextType }, formatCurrency({
-            amount: 
-            // show total without taxes when step is shipping, show total with taxes when step is payment
-            cartStore.step === 'shipping'
-                ? totalWithoutTaxes
-                : cartStore.total,
+            amount: cartStore.total,
             currency: cartStore.currency,
         })))));
     }

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

@@ -65,6 +65,9 @@
 :host .zonos--group::-webkit-scrollbar-thumb:hover {
   background: #d6d6d6;
 }
+:host zonos-button {
+  box-shadow: 0 0 1px 0 var(--amino-gray-600);
+}
 :host .zonos--group-btn {
   position: sticky;
   display: flex;

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

@@ -1,6 +1,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 { formatCurrency } from "../../../utils/formatCurrency";
 import { submitGtag } from "../../../utils/submitGtag";
 export class ZonosShipping {
@@ -35,9 +36,13 @@ export class ZonosShipping {
         this.disabled = true;
     }
     watchFormComplete() {
+        var _a;
         if (!this.disabled) {
             // submit google tag when the form is complete
             submitGtag('zonos-checkout-shipping-info');
+            void trackConversionEvent('checkout_shippingInfoCompleted', {
+                serviceLevelId: (_a = this.selectedShippingMethod) === null || _a === void 0 ? void 0 : _a.value,
+            });
         }
     }
     render() {

package/dist/collection/components/common/component-template/zonos-link/zonos-link.css

@@ -0,0 +1,54 @@
+: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;
+}
+
+/* All sets of variable are here */
+/* smooth font rendering */
+:host {
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+}
+
+:host {
+  display: inline-block;
+}
+:host a {
+  padding-bottom: 2px;
+  color: var(--amino-primary);
+  box-shadow: none;
+  text-decoration: none;
+  /* Non standard for webkit */
+  word-break: break-word;
+  hyphens: auto;
+  overflow-wrap: break-word;
+}
+:host a:link, :host a:visited {
+  color: var(--amino-primary);
+  transition: all 150ms ease-in-out;
+}
+:host a:hover, :host a:active {
+  color: var(--amino-primary);
+  box-shadow: 0 1px 0 var(--amino-primary);
+}