@zonos/elements 1.3.261 → 1.3.263

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

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const debounce = require('./debounce-3e17b4e9.js');
-const localization = require('./localization-a7fac4b4.js');
-const zonosStore = require('./zonosStore-1c517e55.js');
+const debounce = require('./debounce-606d1801.js');
+const localization = require('./localization-68ebf7c6.js');
+const zonosStore = require('./zonosStore-0662b95f.js');
 const classes = require('./classes-b7918f56.js');
 const handleFetch = require('./handleFetch-954f30e1.js');
 const getHasMoreSpaceOnRight = require('./getHasMoreSpaceOnRight-4c94667f.js');
@@ -74,6 +74,29 @@ const getCurrentHelloLocalePage = () => {
     return '';
 };
 
+/**
+ * Default Hello widget diameter in pixels. Matches the legacy size that
+ * shipped before `widgetSize` became configurable, so existing merchants
+ * continue to render unchanged when they have not set a value.
+ */
+const HELLO_WIDGET_DEFAULT_SIZE = 18;
+const HELLO_WIDGET_MIN_SIZE = 18;
+const HELLO_WIDGET_MAX_SIZE = 64;
+/**
+ * Resolve the configured Hello widget size to a safe pixel value. Falls back
+ * to the default when the merchant has not configured a size, and clamps
+ * out-of-range values so the widget always renders within the supported
+ * design bounds.
+ */
+const getHelloWidgetSize = (configuredSize) => {
+    if (configuredSize == null ||
+        !Number.isFinite(configuredSize) ||
+        configuredSize <= 0) {
+        return HELLO_WIDGET_DEFAULT_SIZE;
+    }
+    return Math.min(HELLO_WIDGET_MAX_SIZE, Math.max(HELLO_WIDGET_MIN_SIZE, configuredSize));
+};
+
 const getProductsOnPage = () => {
     var _a, _b;
     const { productAddToCartElementSelector, productDescriptionElementSelector, productTitleElementSelector, restrictionBehavior, } = zonosStore.zonosStore.helloSettings;
@@ -120,7 +143,7 @@ const getProductsOnPage = () => {
     return mergedElements;
 };
 
-const zonosHelloCss = ":host{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--zonos--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:inline-block}:host .zonos--hello-wrapper{position:relative}:host .zonos--hello-wrapper .zonos--hello-dialog-wrapper-mobile-override{position:fixed;bottom:0;left:0;width:100vw;z-index:1001;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}@media (max-width: 768px){:host .zonos--hello-wrapper .zonos--hello-dialog-wrapper{position:fixed;bottom:0;left:0;width:100vw;z-index:1001;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}}@media screen and (min-width: 769px){:host .zonos--hello-wrapper .zonos--hello-dialog-wrapper.zonos--hello-widget-float{position:fixed;bottom:72px;right:32px;width:auto;height:auto;z-index:1001}:host .zonos--hello-wrapper .zonos--hello-dialog-wrapper.zonos--hello-widget-float.zonos--hello-widget-left{left:32px;right:auto}:host .zonos--hello-wrapper .zonos--hello-dialog-wrapper.zonos--hello-widget-float.zonos--hello-widget-top{bottom:auto;top:32px}}:host .zonos--hello-widget{-webkit-transition:all 0.7s cubic-bezier(0.31, -0.02, 0.06, 1.53);transition:all 0.7s cubic-bezier(0.31, -0.02, 0.06, 1.53);padding:6px;border-radius:30px;background:var(--zonos-elements-page-background);font-size:var(--zonos-elements-font-size-s);border:var(--zonos-elements-border);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;cursor:pointer;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;position:relative;z-index:1000}:host .zonos--hello-widget>.zonos--hello-message{-ms-flex-order:0;order:0;max-width:0;height:100%;white-space:nowrap;-webkit-transition:border 0.3s ease-in, all 0.7s cubic-bezier(0.31, -0.02, 0.06, 1.53);transition:border 0.3s ease-in, all 0.7s cubic-bezier(0.31, -0.02, 0.06, 1.53);overflow:hidden;color:var(--zonos-elements-text-color);position:absolute;background:var(--zonos-elements-page-background);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;border-top-left-radius:30px;border-bottom-left-radius:30px;left:0;-webkit-transform:translateX(calc(-100% + 16px));transform:translateX(calc(-100% + 16px));width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border-top:var(--zonos-elements-border);border-bottom:var(--zonos-elements-border)}:host .zonos--hello-widget.zonos--hello-has-restrictions{background:var(--zonos-elements-red-100);border:1px solid var(--zonos-elements-red-200)}:host .zonos--hello-widget.zonos--hello-has-restrictions>.zonos--hello-message{background:var(--zonos-elements-red-100);color:var(--zonos-elements-red-800);font-weight:500}:host .zonos--hello-widget.zonos--hello-has-restrictions.zonos--hello-show-peek-message>.zonos--hello-message{border:1px solid var(--zonos-elements-red-200)}:host .zonos--hello-widget.zonos--hello-show-peek-message{max-width:100vw;width:100%}:host .zonos--hello-widget.zonos--hello-show-peek-message>.zonos--hello-message{max-width:100vw;padding:0 6px;padding-right:16px;border:var(--zonos-elements-border)}:host .zonos--hello-widget.zonos--hello-show-peek-message:not(.zonos--hello-widget-animate-from-left)>.zonos--hello-message{border-right:none}:host .zonos--hello-widget.zonos--hello-show-peek-message.zonos--hello-widget-animate-from-left>.zonos--hello-message{border-left:0}:host .zonos--hello-widget.zonos--hello-show-peek-message.zonos--hello-widget-animate-from-left>.zonos--hello-message{padding-left:16px;padding-right:6px;border-left:none}:host .zonos--hello-widget.zonos--hello-widget-animate-from-left>.zonos--hello-message{-ms-flex-order:1;order:1;-webkit-transform:translateX(calc(100% - 16px));transform:translateX(calc(100% - 16px));right:0;left:auto;border-top-right-radius:30px;border-bottom-right-radius:30px}:host .zonos--hello-widget .zonos--hello-country-flag-wrapper{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}:host .zonos--hello-widget .zonos--hello-country-flag-wrapper .zonos--hello-country-flag{height:18px;width:18px;position:relative;overflow:hidden;border-radius:30px;-webkit-box-shadow:var(--zonos-elements-v3-shadow-medium);box-shadow:var(--zonos-elements-v3-shadow-medium);z-index:10;justify-self:center}:host .zonos--hello-widget.zonos--hello-widget-float{position:fixed;bottom:72px;right:32px}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-left{left:32px;right:auto}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-top{bottom:auto;top:32px}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-has-restrictions.zonos--hello-show-peek-message>.zonos--hello-message{border:none}:host .zonos--hello-widget.zonos--hello-widget-float>.zonos--hello-message{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;border-radius:30px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;top:0;bottom:0;left:0;-webkit-transform:translateX(0);transform:translateX(0);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border:none}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-animate-from-left>.zonos--hello-message{-webkit-transform:translateX(0);transform:translateX(0)}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message.zonos--hello-widget-animate-from-left>.zonos--hello-message{padding-left:8px;padding-right:4px}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message>.zonos--hello-message{padding:0 var(--zonos-elements-radius-4);padding-right:6px;border:none}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float{position:fixed;bottom:72px;right:32px}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-left{left:32px;right:auto}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-top{bottom:auto;top:32px}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-has-restrictions.zonos--hello-show-peek-message>.zonos--hello-message{border:none}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float>.zonos--hello-message{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;border-radius:30px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;top:0;bottom:0;left:0;-webkit-transform:translateX(0);transform:translateX(0);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border:none}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-animate-from-left>.zonos--hello-message{-webkit-transform:translateX(0);transform:translateX(0)}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message.zonos--hello-widget-animate-from-left>.zonos--hello-message{padding-left:8px;padding-right:4px}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message>.zonos--hello-message{padding:0 var(--zonos-elements-radius-4);padding-right:6px;border:none}";
+const zonosHelloCss = ":host{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--zonos--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:inline-block;--zonos-elements-hello-widget-size:18px;--zonos-elements-hello-bubble-padding:max(\n    6px,\n    calc(var(--zonos-elements-hello-widget-size) * 0.22)\n  );--zonos-elements-hello-bubble-size:calc(\n    var(--zonos-elements-hello-widget-size) +\n      var(--zonos-elements-hello-bubble-padding) * 2 + 2px\n  )}:host .zonos--hello-wrapper{position:relative}:host .zonos--hello-wrapper .zonos--hello-dialog-wrapper-mobile-override{position:fixed;bottom:0;left:0;width:100vw;z-index:1001;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}@media (max-width: 768px){:host .zonos--hello-wrapper .zonos--hello-dialog-wrapper{position:fixed;bottom:0;left:0;width:100vw;z-index:1001;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}}@media screen and (min-width: 769px){:host .zonos--hello-wrapper .zonos--hello-dialog-wrapper.zonos--hello-widget-float{position:fixed;bottom:72px;right:32px;width:auto;height:auto;z-index:1001}:host .zonos--hello-wrapper .zonos--hello-dialog-wrapper.zonos--hello-widget-float.zonos--hello-widget-left{left:32px;right:auto}:host .zonos--hello-wrapper .zonos--hello-dialog-wrapper.zonos--hello-widget-float.zonos--hello-widget-top{bottom:auto;top:32px}}:host .zonos--hello-widget{-webkit-transition:all 0.7s cubic-bezier(0.31, -0.02, 0.06, 1.53);transition:all 0.7s cubic-bezier(0.31, -0.02, 0.06, 1.53);padding:var(--zonos-elements-hello-bubble-padding);border-radius:9999px;background:var(--zonos-elements-page-background);font-size:var(--zonos-elements-font-size-s);border:var(--zonos-elements-border);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;position:relative;z-index:1000}:host .zonos--hello-widget>.zonos--hello-message{-ms-flex-order:0;order:0;max-width:0;height:100%;white-space:nowrap;-webkit-transition:border 0.3s ease-in, all 0.7s cubic-bezier(0.31, -0.02, 0.06, 1.53);transition:border 0.3s ease-in, all 0.7s cubic-bezier(0.31, -0.02, 0.06, 1.53);overflow:hidden;color:var(--zonos-elements-text-color);position:absolute;background:var(--zonos-elements-page-background);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;border-top-left-radius:calc(var(--zonos-elements-hello-bubble-size) / 2);border-bottom-left-radius:calc(var(--zonos-elements-hello-bubble-size) / 2);left:0;-webkit-transform:translateX(calc(-100% + var(--zonos-elements-hello-bubble-size) / 2));transform:translateX(calc(-100% + var(--zonos-elements-hello-bubble-size) / 2));width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border-top:var(--zonos-elements-border);border-bottom:var(--zonos-elements-border)}:host .zonos--hello-widget.zonos--hello-has-restrictions{background:var(--zonos-elements-red-100);border:1px solid var(--zonos-elements-red-200)}:host .zonos--hello-widget.zonos--hello-has-restrictions>.zonos--hello-message{background:var(--zonos-elements-red-100);color:var(--zonos-elements-red-800);font-weight:500}:host .zonos--hello-widget.zonos--hello-has-restrictions.zonos--hello-show-peek-message>.zonos--hello-message{border:1px solid var(--zonos-elements-red-200)}:host .zonos--hello-widget.zonos--hello-show-peek-message{max-width:100vw;width:100%}:host .zonos--hello-widget.zonos--hello-show-peek-message>.zonos--hello-message{max-width:100vw;padding:0 calc(var(--zonos-elements-hello-bubble-size) / 2);border:var(--zonos-elements-border)}:host .zonos--hello-widget.zonos--hello-show-peek-message:not(.zonos--hello-widget-animate-from-left)>.zonos--hello-message{border-right:none}:host .zonos--hello-widget.zonos--hello-show-peek-message.zonos--hello-widget-animate-from-left>.zonos--hello-message{padding-left:calc(var(--zonos-elements-hello-bubble-size) / 2);border-left:none}:host .zonos--hello-widget.zonos--hello-widget-animate-from-left>.zonos--hello-message{-ms-flex-order:1;order:1;-webkit-transform:translateX(calc(100% - var(--zonos-elements-hello-bubble-size) / 2));transform:translateX(calc(100% - var(--zonos-elements-hello-bubble-size) / 2));right:0;left:auto;border-top-right-radius:calc(var(--zonos-elements-hello-bubble-size) / 2);border-bottom-right-radius:calc(var(--zonos-elements-hello-bubble-size) / 2)}:host .zonos--hello-widget .zonos--hello-country-flag-wrapper{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}:host .zonos--hello-widget .zonos--hello-country-flag-wrapper .zonos--hello-country-flag{height:18px;width:18px;position:relative;overflow:hidden;border-radius:30px;-webkit-box-shadow:var(--zonos-elements-v3-shadow-medium);box-shadow:var(--zonos-elements-v3-shadow-medium);z-index:10;justify-self:center;height:var(--zonos-elements-hello-widget-size);width:var(--zonos-elements-hello-widget-size)}:host .zonos--hello-widget.zonos--hello-widget-float{position:fixed;bottom:72px;right:32px}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-left{left:32px;right:auto}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-top{bottom:auto;top:32px}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-has-restrictions.zonos--hello-show-peek-message>.zonos--hello-message{border:none}:host .zonos--hello-widget.zonos--hello-widget-float>.zonos--hello-message{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;border-radius:30px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;top:0;bottom:0;left:0;-webkit-transform:translateX(0);transform:translateX(0);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border:none}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-animate-from-left>.zonos--hello-message{-webkit-transform:translateX(0);transform:translateX(0)}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message.zonos--hello-widget-animate-from-left>.zonos--hello-message{padding-left:8px;padding-right:4px}:host .zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message>.zonos--hello-message{padding:0 var(--zonos-elements-radius-4);padding-right:6px;border:none}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float{position:fixed;bottom:72px;right:32px}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-left{left:32px;right:auto}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-top{bottom:auto;top:32px}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-has-restrictions.zonos--hello-show-peek-message>.zonos--hello-message{border:none}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float>.zonos--hello-message{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;border-radius:30px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;top:0;bottom:0;left:0;-webkit-transform:translateX(0);transform:translateX(0);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border:none}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-widget-animate-from-left>.zonos--hello-message{-webkit-transform:translateX(0);transform:translateX(0)}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message.zonos--hello-widget-animate-from-left>.zonos--hello-message{padding-left:8px;padding-right:4px}:host .zonos--hello-mobile-override.zonos--hello-widget.zonos--hello-widget-float.zonos--hello-show-peek-message>.zonos--hello-message{padding:0 var(--zonos-elements-radius-4);padding-right:6px;border:none}";
 const ZonosHelloStyle0 = zonosHelloCss;
 
 const PEEK_MESSAGE_CLOSE_DELAY_MS = 3000;
@@ -459,7 +482,7 @@ const ZonosHello = class {
     }
     getHelloLocation() {
         const mobileLocation = this.mobileLocationOverride || zonosStore.zonosStore.helloSettings.mobileLocation;
-        const desktopLocation = zonosStore.zonosStore.helloSettings.desktopLocation;
+        const desktopLocation = this.desktopLocationOverride || zonosStore.zonosStore.helloSettings.desktopLocation;
         const isMobileWindow = this.isMobile;
         switch (true) {
             // Mobile
@@ -477,19 +500,27 @@ const ZonosHello = class {
             default:
             case !isMobileWindow: {
                 /**
-                 * Only float on desktop if there is no anchor specified and desktopLocation is set
-                 * This is to keep the same behavior as it is now (display at anchor if set on desktop, float on mobile).
-                 **/
-                const shouldFloat = !zonosStore.zonosStore.helloSettings.anchorElementSelector && !!desktopLocation;
+                 * Float on desktop when `desktopLocationOverride` is set (explicit
+                 * consumer request) OR when no anchor is specified and a
+                 * `desktopLocation` is configured in the store. With an anchor and no
+                 * override, the widget renders inline at the anchor.
+                 */
+                const shouldFloat = !!this.desktopLocationOverride ||
+                    (!zonosStore.zonosStore.helloSettings.anchorElementSelector &&
+                        !!desktopLocation);
+                // When a desktopLocation is set, derive the side deterministically
+                // from it so RIGHT positions resolve to `false` (not `undefined`).
+                // Spatial detection only runs as a fallback when no location is set
+                // (e.g. inline / anchored placement).
                 const isOnLeft = this.animateFromLeftOverride ||
-                    (desktopLocation === null || desktopLocation === void 0 ? void 0 : desktopLocation.includes('LEFT')) ||
-                    this.shouldAnimateLeftDesktop();
+                    (desktopLocation
+                        ? desktopLocation.includes('LEFT')
+                        : this.shouldAnimateLeftDesktop());
                 const isOnTop = desktopLocation === null || desktopLocation === void 0 ? void 0 : desktopLocation.includes('TOP');
                 return {
                     isMobileWindow,
                     isOnLeft,
                     isOnTop,
-                    // Only float if
                     shouldFloat,
                 };
             }
@@ -528,7 +559,8 @@ const ZonosHello = class {
                 currencyCode: targetCurrency,
             });
         }
-        return (index.h(index.Host, { class: "zonos--hello zonos--elements", "data-theme": theme }, showHello && (index.h("div", { class: classes.classes([
+        const widgetSize = getHelloWidgetSize(zonosStore.zonosStore.helloSettings.widgetSize);
+        return (index.h(index.Host, { class: "zonos--hello zonos--elements", "data-theme": theme, style: { '--zonos-elements-hello-widget-size': `${widgetSize}px` } }, showHello && (index.h("div", { class: classes.classes([
                 'zonos--hello-wrapper',
                 shouldFloat && 'zonos--hello-widget-float',
             ]) }, index.h("button", { class: classes.classes([
@@ -551,7 +583,7 @@ const ZonosHello = class {
                     'zonos--hello-widget-left zonos--hello-widget-animate-from-left',
                 isOnTop && 'zonos--hello-widget-top',
                 shouldFloat && 'zonos--hello-widget-float',
-            ]), style: { height: this.showDialog ? 'fit-content' : '0px' } }, index.h("zonos-hello-dialog", { animateFromLeftOverride: this.animateFromLeftOverride, appearanceSettings: appearanceSettings, isOpen: this.showDialog, mobileLocationOverride: this.mobileLocationOverride, restrictedItems: restrictedItemsOnPage, setIsOpen: this.changeShowDialog }))))));
+            ]), style: { height: this.showDialog ? 'fit-content' : '0px' } }, index.h("zonos-hello-dialog", { animateFromLeftOverride: isOnLeft, appearanceSettings: appearanceSettings, isOpen: this.showDialog, mobileLocationOverride: this.mobileLocationOverride, restrictedItems: restrictedItemsOnPage, setIsOpen: this.changeShowDialog }))))));
     }
     get helloElement() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const zonosStore = require('./zonosStore-1c517e55.js');
+const zonosStore = require('./zonosStore-0662b95f.js');
 const classes = require('./classes-b7918f56.js');
-const getBorderRadius = require('./getBorderRadius-db55a464.js');
+const getBorderRadius = require('./getBorderRadius-a91911e7.js');
 require('./VarianceTest-bec00ea8.js');
 
 const zonosInputCss = ":host{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--zonos--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{margin:1px}:host .zonos--label-wrapper{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;height:100%;width:100%;background:var(--zonos-elements-input-background);border-radius:var(--zonos--border-radius);border:var(--zonos-elements-border)}:host .zonos--label-wrapper:hover{border:1px solid var(--zonos-elements-gray-300)}:host .zonos--floated-input{-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;padding:0 16px;outline:none;-webkit-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);width:100%;border-radius:var(--zonos--border-radius);background:var(--zonos-elements-input-background);border:0;-ms-flex-order:2;order:2;font-weight:500}:host .zonos--floated-input :-internal-autofill-selected{border-radius:var(--zonos-elements-radius-6) 0 0 var(--zonos-elements-radius-6)}:host .zonos--floated-input :-internal-autofill-selected+label+div{background-color:#e8f0fe}:host .zonos--floated-input.has-label{padding:16px 4px 8px 16px}:host .zonos--floated-input.has-label.has-input-prefix{padding-left:0}:host .zonos--floated-input.has-label.has-input-prefix+.zonos--floated-label::before{margin-left:0}:host .zonos--floated-input:not(.has-label)::-webkit-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}:host .zonos--floated-input:not(.has-label)::-moz-placeholder{opacity:var(--zonos-elements-opacity-disabled)}:host .zonos--floated-input:not(.has-label):-ms-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}:host .zonos--floated-input:not(.has-label)::-ms-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}:host .zonos--floated-input:not(.has-label)::placeholder{opacity:var(--zonos-elements-opacity-disabled)}:host .zonos--floated-input::-webkit-input-placeholder{-webkit-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);opacity:0}:host .zonos--floated-input::-moz-placeholder{-moz-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);opacity:0}:host .zonos--floated-input:-ms-input-placeholder{-ms-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);opacity:0}:host .zonos--floated-input::-ms-input-placeholder{-ms-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);opacity:0}:host .zonos--floated-input::placeholder{-webkit-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);opacity:0}:host .zonos--floated-input:focus{outline:none}:host .zonos--floated-input:focus+.zonos--floated-label::after{-webkit-box-shadow:var(--zonos-elements-glow-blue);box-shadow:var(--zonos-elements-glow-blue)}:host .zonos--floated-input.has-error+.zonos--floated-label::after{-webkit-box-shadow:var(--zonos-elements-glow-error);box-shadow:var(--zonos-elements-glow-error)}:host .zonos--floated-input.has-content::-webkit-input-placeholder,:host .zonos--floated-input:focus::-webkit-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}:host .zonos--floated-input.has-content::-moz-placeholder,:host .zonos--floated-input:focus::-moz-placeholder{opacity:var(--zonos-elements-opacity-disabled)}:host .zonos--floated-input.has-content:-ms-input-placeholder,:host .zonos--floated-input:focus:-ms-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}:host .zonos--floated-input.has-content::-ms-input-placeholder,:host .zonos--floated-input:focus::-ms-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}:host .zonos--floated-input.has-content::placeholder,:host .zonos--floated-input:focus::placeholder{opacity:var(--zonos-elements-opacity-disabled)}:host .zonos--floated-input.has-content+.zonos--floated-label::before,:host .zonos--floated-input:focus+.zonos--floated-label::before{top:11px;-webkit-transform:scale(0.8);transform:scale(0.8)}:host .zonos--floated-input:-webkit-autofill,:host .zonos--floated-input:-moz-autofill{background-color:var(--zonos-elements-input-background);color:var(--zonos-elements-text-color)}:host .zonos--floated-label{display:block;max-height:0;pointer-events:none;-ms-flex-order:1;order:1}:host .zonos--floated-label::before{content:attr(data-label);color:var(--zonos-elements-gray-800);position:absolute;font-size:var(--zonos-elements-font-size-base);line-height:var(--zonos-elements-font-size-base);display:inline-block;-webkit-filter:blur(0);filter:blur(0);-webkit-transform-origin:left top;transform-origin:left top;-webkit-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);margin-left:16px;top:calc(50% - var(--zonos-elements-font-size-base) / 2);z-index:1}:host .zonos--floated-label::after{content:\"\";position:absolute;left:0;right:0;top:0;bottom:0;border-radius:var(--zonos--border-radius)}:host{}:host .disabled .zonos--floated-label{pointer-events:inherit}:host .disabled .zonos--floated-label::after{cursor:not-allowed;z-index:1}:host(.sm){height:calc(var(--zonos-elements-size-sm) - 2px)}:host(.sm) .zonos--floated-input.has-label{padding-top:13px;padding-bottom:0}:host(.sm) .zonos--floated-input.has-label:focus+.zonos--floated-label::before,:host(.sm) .zonos--floated-input.has-label.has-content+.zonos--floated-label::before{top:2px}:host(.md){height:calc(var(--zonos-elements-size-md) - 2px)}:host(.md) .zonos--floated-input.has-label{padding-top:20px}:host(.md) .zonos--floated-input.has-label:focus+.zonos--floated-label::before,:host(.md) .zonos--floated-input.has-label.has-content+.zonos--floated-label::before{top:6px}:host(.lg){height:calc(var(--zonos-elements-size-lg) - 2px)}:host(.lg) .zonos--floated-input.has-label:focus+.zonos--floated-label::before,:host(.lg) .zonos--floated-input.has-label.has-content+.zonos--floated-label::before{top:10px}:host(.xl){height:calc(var(--zonos-elements-size-xl) - 2px)}:host(.xl) .zonos--floated-input.has-label{padding-bottom:2px}";

package/dist/cjs/zonos-invoice-cart-items_2.cjs.entry.js

@@ -3,17 +3,17 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const cart = require('./cart-d08c87e2.js');
-const localization = require('./localization-a7fac4b4.js');
-const renderCheckoutCurrency = require('./renderCheckoutCurrency-a374741a.js');
+const cart = require('./cart-02a93797.js');
+const localization = require('./localization-68ebf7c6.js');
+const renderCheckoutCurrency = require('./renderCheckoutCurrency-d163c1c4.js');
 const classes = require('./classes-b7918f56.js');
-const invoice = require('./invoice-e64f97c6.js');
+const invoice = require('./invoice-215b8d2b.js');
 const renderFallback = require('./renderFallback-bc20ee20.js');
-require('./zonosStore-1c517e55.js');
+require('./zonosStore-0662b95f.js');
 require('./VarianceTest-bec00ea8.js');
 require('./handleFetch-954f30e1.js');
-require('./isDarkColor-bfe6d1eb.js');
-require('./getBorderRadius-db55a464.js');
+require('./isDarkColor-e317bb06.js');
+require('./getBorderRadius-a91911e7.js');
 
 const zonosInvoiceCartItemsCss = ":host{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--zonos--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 .zonos--cart-table{width:100%;border:none;border-collapse:collapse;overflow:auto;font-size:var(--zonos-elements-font-size-base)}:host .zonos--cart-table .zonos--column{padding:8px;padding-left:0;font-size:var(--zonos-elements-font-size-base)}:host .zonos--cart-table .zonos--column:last-child{text-align:right;padding-right:0}:host .zonos--cart-table .zonos--column:first-child{padding-left:0;width:50px}:host .zonos--cart-table .zonos--cart-item-link{text-align:left}:host .zonos--cart-table .zonos--cart-item-created-at{text-align:right}:host .zonos--cart-table td{vertical-align:middle}:host .zonos--cart-item-price zonos-text{white-space:nowrap}:host(.mobile) table{margin-top:16px}:host(.mobile) table td{vertical-align:top}";
 const ZonosInvoiceCartItemsStyle0 = zonosInvoiceCartItemsCss;

package/dist/cjs/zonos-invoice-finish_5.cjs.entry.js

@@ -3,24 +3,24 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const cart = require('./cart-d08c87e2.js');
-const paypal = require('./paypal-73a542cb.js');
-const localization = require('./localization-a7fac4b4.js');
-const zonosStore = require('./zonosStore-1c517e55.js');
+const cart = require('./cart-02a93797.js');
+const paypal = require('./paypal-f8a0cca3.js');
+const localization = require('./localization-68ebf7c6.js');
+const zonosStore = require('./zonosStore-0662b95f.js');
 const handleFetch = require('./handleFetch-954f30e1.js');
 const createCustomEvent = require('./createCustomEvent-7b6fad95.js');
-const getBorderRadius = require('./getBorderRadius-db55a464.js');
+const getBorderRadius = require('./getBorderRadius-a91911e7.js');
 const VarianceTest = require('./VarianceTest-bec00ea8.js');
-const submitGtag = require('./submitGtag-9ac5a42e.js');
 const isInvoiceMobileTablet = require('./isInvoiceMobileTablet-dde41e4e.js');
 const classes = require('./classes-b7918f56.js');
 const ILanguage = require('./ILanguage-98b04442.js');
-const invoice = require('./invoice-e64f97c6.js');
-const renderCheckoutCurrency = require('./renderCheckoutCurrency-a374741a.js');
-const placeTestOrder = require('./placeTestOrder-aefd31e8.js');
+const invoice = require('./invoice-215b8d2b.js');
+const renderCheckoutCurrency = require('./renderCheckoutCurrency-d163c1c4.js');
+const placeTestOrder = require('./placeTestOrder-ce734b60.js');
 const renderFallback = require('./renderFallback-bc20ee20.js');
-require('./isDarkColor-bfe6d1eb.js');
-require('./isContrastColor-6a17f408.js');
+require('./isDarkColor-e317bb06.js');
+require('./isContrastColor-a02c4889.js');
+require('./submitGtag-07a3b09e.js');
 
 const RemoveIcon = `<svg color="var(--zonos-elements-red-800)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="https://www.w3.org/2000/svg"><path clip-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" data-is-secondary-color="true" fill="var(--zonos-elements-red-200)" fill-rule="evenodd"></path><path clip-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" fill="currentColor" fill-rule="evenodd"></path></svg>`;
 
@@ -159,7 +159,7 @@ const ZonosInvoiceFinish = class {
                 window.history.replaceState({}, '', url.toString());
                 // Payment doesn't go through
                 if (error && (messages === null || messages === void 0 ? void 0 : messages.length)) {
-                    submitGtag.submitGtag({ event: 'zonos-checkout-payment-fail' });
+                    paypal.submitAnalytics({ event: 'zonos-checkout-payment-fail' });
                     void handleFetch.sendErrorLog({
                         endpoint: 'Stripe payment failed',
                         errors: [
@@ -172,7 +172,7 @@ const ZonosInvoiceFinish = class {
                     });
                 }
                 else {
-                    submitGtag.submitGtag({ event: 'zonos-checkout-success' });
+                    paypal.submitAnalytics({ event: 'zonos-checkout-success' });
                     const checkoutSessionId = localization.storageStore.checkoutSessionId;
                     void cart.trackConversionEvent({
                         checkoutSessionId,
@@ -217,7 +217,7 @@ const ZonosInvoiceFinish = class {
             // show success message right away when order id is already created
             this.isLoading = false;
             if (paypal.paypalStore.orderIdCreated) {
-                submitGtag.submitGtag({ event: 'zonos-checkout-success' });
+                paypal.submitAnalytics({ event: 'zonos-checkout-success' });
                 const checkoutSessionId = localization.storageStore.checkoutSessionId;
                 void cart.trackConversionEvent({
                     checkoutSessionId,
@@ -273,11 +273,11 @@ const ZonosInvoiceFinish = class {
     }
     render() {
         const cartId = window.Zonos.cartId;
-        return (index.h(index.Host, { key: '4b4f83358419134c8455c4407f91adf8c1ff37ca', class: "zonos--checkout-finish zonos--elements", style: {
+        return (index.h(index.Host, { key: '6c0363334a9e6602b93e83a0dfeb733285db7683', class: "zonos--checkout-finish zonos--elements", style: {
                 '--zonos--border-radius': getBorderRadius.getBorderRadius({
                     overrideBorderStyle: this.borderRadius,
                 }),
-            } }, !this.isLoading && (index.h("div", { key: 'fab4606540bf759d9241432f58580b10f1c12b03', class: "zonos--finish-details" }, index.h("div", { key: 'b619eee9fda1e183b4d761f3576ae28cee2a9619', 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: '30fa51dba81331c9aa7ff4f64c274982d36d8a23', class: "zonos--title", type: "semiBoldSubheader" }, this.notificationTitle), this.confirmationId && (index.h("zonos-badge", { key: 'f10389b65e7910c7b3bd1e0d576afde74bc28e27', badgeColor: "gray" }, this.confirmationId)), index.h("zonos-text", { key: '5033c51a90cdbccb8b0a333f7b63f3383b70c264', class: "zonos--subtitle", textColor: "gray-600" }, this.notificationMessages.map(message => (index.h(index.Fragment, null, message, index.h("br", null))))), this.order && cartId && (index.h("div", { key: '83350cb42d4165ec874a8b18dc29e851ca4ae4c8', class: "zonos--button-container" }, index.h("zonos-button", { key: 'fa05f016f520f65660270c906b7a5940b808cb4b', onClick: () => {
+            } }, !this.isLoading && (index.h("div", { key: '299a9afc37f5e1bbe828f2b68569a686b82baff1', class: "zonos--finish-details" }, index.h("div", { key: '24a827b96c4a74066b7701c70f6cdf980ff060f5', 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: '74bfa9e0126ea8b0a693fdc2e034cdd6ef352dcb', class: "zonos--title", type: "semiBoldSubheader" }, this.notificationTitle), this.confirmationId && (index.h("zonos-badge", { key: '5cc0089225fac166cfa13cc11e72efeb34ad8567', badgeColor: "gray" }, this.confirmationId)), index.h("zonos-text", { key: 'fb101b1058adeafe38a03d2a915b6b7f80c44061', class: "zonos--subtitle", textColor: "gray-600" }, this.notificationMessages.map(message => (index.h(index.Fragment, null, message, index.h("br", null))))), this.order && cartId && (index.h("div", { key: '2ecc8d45967ccd720f0ec4d532aa266ac42acc14', class: "zonos--button-container" }, index.h("zonos-button", { key: '3f04711341f273a767d5109274f92eec424b1675', onClick: () => {
                 window.open(this.getReceiptUrl({ cartId }), '_blank');
             }, size: "lg", variant: "primary" }, localization.translate('View receipt')))))))));
     }
@@ -479,7 +479,7 @@ const ZonosInvoicePayment = class {
             }
             cart.stripeStore.checkoutSettlementCurrency = currencyCode;
             // submit google tag when the form is complete
-            submitGtag.submitGtag({ event: 'zonos-checkout-payment-info' });
+            paypal.submitAnalytics({ event: 'zonos-checkout-payment-info' });
             this.continueClicked.emit();
         };
         this.copyCardToClipboard = async (cardNumber) => {

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

@@ -3,21 +3,21 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const cart = require('./cart-d08c87e2.js');
-const invoice = require('./invoice-e64f97c6.js');
-const paypal = require('./paypal-73a542cb.js');
-const localization = require('./localization-a7fac4b4.js');
-const zonosStore = require('./zonosStore-1c517e55.js');
+const cart = require('./cart-02a93797.js');
+const invoice = require('./invoice-215b8d2b.js');
+const paypal = require('./paypal-f8a0cca3.js');
+const localization = require('./localization-68ebf7c6.js');
+const zonosStore = require('./zonosStore-0662b95f.js');
 const buildCartItemsByTempCart = require('./buildCartItemsByTempCart-edddbf4b.js');
 const handleFetch = require('./handleFetch-954f30e1.js');
 const isInvoiceMobileTablet = require('./isInvoiceMobileTablet-dde41e4e.js');
 const classes = require('./classes-b7918f56.js');
 const VarianceTest = require('./VarianceTest-bec00ea8.js');
 const ILanguage = require('./ILanguage-98b04442.js');
-require('./isDarkColor-bfe6d1eb.js');
-require('./getBorderRadius-db55a464.js');
-require('./isContrastColor-6a17f408.js');
-require('./submitGtag-9ac5a42e.js');
+require('./isDarkColor-e317bb06.js');
+require('./getBorderRadius-a91911e7.js');
+require('./isContrastColor-a02c4889.js');
+require('./submitGtag-07a3b09e.js');
 
 const ChevronDownIcon = `<svg color="var(--zonos-elements-gray-400)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="https://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M6.293 9.293a1 1 0 0 1 1.414 0L12 13.586l4.293-4.293a1 1 0 0 1 1.414 1.414l-4.93 4.93a1.1 1.1 0 0 1-1.555 0l-4.93-4.93a1 1 0 0 1 0-1.414Z" fill="currentColor" fill-rule="evenodd"></path></svg>`;
 

package/dist/cjs/zonos-language-select_2.cjs.entry.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const localization = require('./localization-a7fac4b4.js');
-const zonosStore = require('./zonosStore-1c517e55.js');
+const localization = require('./localization-68ebf7c6.js');
+const zonosStore = require('./zonosStore-0662b95f.js');
 const ILanguage = require('./ILanguage-98b04442.js');
 require('./handleFetch-954f30e1.js');
 require('./VarianceTest-bec00ea8.js');

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const zonosStore = require('./zonosStore-1c517e55.js');
+const zonosStore = require('./zonosStore-0662b95f.js');
 const classes = require('./classes-b7918f56.js');
 require('./VarianceTest-bec00ea8.js');
 

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

@@ -3,14 +3,14 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const zonosStore = require('./zonosStore-1c517e55.js');
+const zonosStore = require('./zonosStore-0662b95f.js');
 const classes = require('./classes-b7918f56.js');
-const getBorderRadius = require('./getBorderRadius-db55a464.js');
-const getContrastColor = require('./getContrastColor-8ed1cb48.js');
+const getBorderRadius = require('./getBorderRadius-a91911e7.js');
+const getContrastColor = require('./getContrastColor-68058615.js');
 const isColorVariable = require('./isColorVariable-525dbfa7.js');
 require('./VarianceTest-bec00ea8.js');
-require('./isDarkColor-bfe6d1eb.js');
-require('./isContrastColor-6a17f408.js');
+require('./isDarkColor-e317bb06.js');
+require('./isContrastColor-a02c4889.js');
 
 const zonosShippingRichRadioCss = ":host{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--zonos--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(--zonos--selected-border-color, var(--zonos-elements-blue-600))}:host .zonos--shipping-rich-radio-item{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;padding:16px;-ms-flex-align:center;align-items:center;gap:16px;cursor:pointer;border:1px solid var(--zonos-elements-gray-200)}:host .zonos--shipping-rich-radio-item:first-child{border-top-left-radius:var(--zonos--border-radius, var(--zonos-elements-radius-10));border-top-right-radius:var(--zonos--border-radius, var(--zonos-elements-radius-10))}:host .zonos--shipping-rich-radio-item:last-child{border-bottom-right-radius:var(--zonos--border-radius, var(--zonos-elements-radius-10));border-bottom-left-radius:var(--zonos--border-radius, var(--zonos-elements-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(--zonos--selected-border-color, var(--zonos-elements-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}";
 const ZonosShippingRichRadioStyle0 = zonosShippingRichRadioCss;

package/dist/cjs/zonos-store-credit.cjs.entry.js

@@ -3,14 +3,14 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const cart = require('./cart-d08c87e2.js');
-const localization = require('./localization-a7fac4b4.js');
-const zonosStore = require('./zonosStore-1c517e55.js');
-const renderCheckoutCurrency = require('./renderCheckoutCurrency-a374741a.js');
-const getBorderRadius = require('./getBorderRadius-db55a464.js');
+const cart = require('./cart-02a93797.js');
+const localization = require('./localization-68ebf7c6.js');
+const zonosStore = require('./zonosStore-0662b95f.js');
+const renderCheckoutCurrency = require('./renderCheckoutCurrency-d163c1c4.js');
+const getBorderRadius = require('./getBorderRadius-a91911e7.js');
 require('./VarianceTest-bec00ea8.js');
 require('./handleFetch-954f30e1.js');
-require('./isDarkColor-bfe6d1eb.js');
+require('./isDarkColor-e317bb06.js');
 
 const StoreCreditIcon = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" aria-hidden="true">
   <path fill="currentColor" fill-rule="evenodd" d="M4 5a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h16a3 3 0 0 0 3-3V8a3 3 0 0 0-3-3H4Zm16 2H4a1 1 0 0 0-1 1v1h18V8a1 1 0 0 0-1-1ZM2 11h20v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-3Zm6 4.5a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2H9a1 1 0 0 1-1-1Z" clip-rule="evenodd"/>

package/dist/cjs/zonos-stripe-input.cjs.entry.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const zonosStore = require('./zonosStore-1c517e55.js');
+const zonosStore = require('./zonosStore-0662b95f.js');
 const helpers = require('./helpers-5bdbb68c.js');
 const classes = require('./classes-b7918f56.js');
-const getBorderRadius = require('./getBorderRadius-db55a464.js');
-const isDarkColor = require('./isDarkColor-bfe6d1eb.js');
+const getBorderRadius = require('./getBorderRadius-a91911e7.js');
+const isDarkColor = require('./isDarkColor-e317bb06.js');
 require('./VarianceTest-bec00ea8.js');
 
 const zonosStripeInputCss = ".sc-zonos-stripe-input-h{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-stripe-input-h *.sc-zonos-stripe-input{font-family:var(--zonos--font-family, Inter), Inter}.sc-zonos-stripe-input-h img.sc-zonos-stripe-input{max-width:100%}.sc-zonos-stripe-input-h dl.sc-zonos-stripe-input,.sc-zonos-stripe-input-h dd.sc-zonos-stripe-input,.sc-zonos-stripe-input-h h1.sc-zonos-stripe-input,.sc-zonos-stripe-input-h h2.sc-zonos-stripe-input,.sc-zonos-stripe-input-h h3.sc-zonos-stripe-input,.sc-zonos-stripe-input-h h4.sc-zonos-stripe-input,.sc-zonos-stripe-input-h h5.sc-zonos-stripe-input,.sc-zonos-stripe-input-h h6.sc-zonos-stripe-input,.sc-zonos-stripe-input-h hr.sc-zonos-stripe-input,.sc-zonos-stripe-input-h figure.sc-zonos-stripe-input,.sc-zonos-stripe-input-h p.sc-zonos-stripe-input,.sc-zonos-stripe-input-h pre.sc-zonos-stripe-input{margin:0}.sc-zonos-stripe-input-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-stripe-input-h{--zonos--background-color:#f1f1f1;--zonos--local-glowing-color:0 0 0 3px hsla(0, 0%, 100%, 25%),\n    0 0 0 1px var(--zonos--primary-color);--zonos--border:1px solid #e8e8e8}.dark.sc-zonos-stripe-input-h{color-scheme:dark;--zonos--background-color:#30313d;--zonos--local-glowing-color:0px 2px 4px rgba(0, 0, 0, 0.5),\n    0px 1px 6px rgba(0, 0, 0, 0.25), 0 0 0 3px hsla(0, 0%, 100%, 25%),\n    0 1px 1px 0 rgba(255, 255, 255, 0.12);--zonos--border:1px solid var(--zonos--primary-color)}.sc-zonos-stripe-input-h{margin:1px}.sc-zonos-stripe-input-h .zonos--label-wrapper.sc-zonos-stripe-input{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;width:100%;background:var(--zonos--background-color);border-radius:var(--zonos--border-radius);border:var(--zonos--border);outline-offset:0;outline-width:2px;height:calc(var(--zonos-elements-size-xl) - 2px)}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input{-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;padding:0 16px;outline:none;-webkit-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);width:100%;border-radius:var(--zonos--border-radius);background:var(--zonos--background-color);border:var(--zonos--border);-ms-flex-order:2;order:2;font-weight:400;font-size:var(--zonos--font-size);color:var(--zonos-elements-text-color);height:auto}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input .sc-zonos-stripe-input:-internal-autofill-selected{border-radius:var(--zonos-elements-radius-6) 0 0 var(--zonos-elements-radius-6)}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input .sc-zonos-stripe-input:-internal-autofill-selected+label.sc-zonos-stripe-input+div.sc-zonos-stripe-input{background-color:#e8f0fe}.sc-zonos-stripe-input-h .zonos--floated-input.has-label.sc-zonos-stripe-input{padding:24px 4px 2px 16px}.sc-zonos-stripe-input-h .zonos--floated-input.has-label.has-input-prefix.sc-zonos-stripe-input{padding-left:0}.sc-zonos-stripe-input-h .zonos--floated-input.has-label.has-input-prefix.sc-zonos-stripe-input~.zonos--floated-label.sc-zonos-stripe-input label.sc-zonos-stripe-input{margin-left:0}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:not(.has-label)::-webkit-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:not(.has-label)::-moz-placeholder{opacity:var(--zonos-elements-opacity-disabled)}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:not(.has-label):-ms-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:not(.has-label)::-ms-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:not(.has-label)::placeholder{opacity:var(--zonos-elements-opacity-disabled)}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input::-webkit-input-placeholder{-webkit-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);opacity:0}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input::-moz-placeholder{-moz-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);opacity:0}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:-ms-input-placeholder{-ms-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);opacity:0}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input::-ms-input-placeholder{-ms-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);opacity:0}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input::placeholder{-webkit-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);opacity:0}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:focus{outline:none;border:var(--zonos--border)}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:focus~.zonos--floated-label.sc-zonos-stripe-input::after{-webkit-box-shadow:var(--zonos--glowing-color, var(--zonos--local-glowing-color));box-shadow:var(--zonos--glowing-color, var(--zonos--local-glowing-color))}.sc-zonos-stripe-input-h .zonos--floated-input.has-error.sc-zonos-stripe-input~.zonos--floated-label.sc-zonos-stripe-input::after{-webkit-box-shadow:0 0 0 2px #df1b41;box-shadow:0 0 0 2px #df1b41}.sc-zonos-stripe-input-h .zonos--floated-input.has-content.sc-zonos-stripe-input::-webkit-input-placeholder,.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:focus::-webkit-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}.sc-zonos-stripe-input-h .zonos--floated-input.has-content.sc-zonos-stripe-input::-moz-placeholder,.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:focus::-moz-placeholder{opacity:var(--zonos-elements-opacity-disabled)}.sc-zonos-stripe-input-h .zonos--floated-input.has-content.sc-zonos-stripe-input:-ms-input-placeholder,.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:focus:-ms-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}.sc-zonos-stripe-input-h .zonos--floated-input.has-content.sc-zonos-stripe-input::-ms-input-placeholder,.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:focus::-ms-input-placeholder{opacity:var(--zonos-elements-opacity-disabled)}.sc-zonos-stripe-input-h .zonos--floated-input.has-content.sc-zonos-stripe-input::placeholder,.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:focus::placeholder{opacity:var(--zonos-elements-opacity-disabled)}.sc-zonos-stripe-input-h .zonos--floated-input.has-content.sc-zonos-stripe-input~.zonos--floated-label.sc-zonos-stripe-input label.sc-zonos-stripe-input,.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:focus~.zonos--floated-label.sc-zonos-stripe-input label.sc-zonos-stripe-input{top:11px;-webkit-transform:scale(0.8);transform:scale(0.8)}.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:-webkit-autofill,.sc-zonos-stripe-input-h .zonos--floated-input.sc-zonos-stripe-input:-moz-autofill{background-color:var(--zonos-elements-input-background);color:var(--zonos-elements-text-color)}.sc-zonos-stripe-input-h .zonos--floated-label.sc-zonos-stripe-input{display:block;max-height:0;pointer-events:none;-ms-flex-order:1;order:1}.sc-zonos-stripe-input-h .zonos--floated-label.sc-zonos-stripe-input label.sc-zonos-stripe-input{color:var(--zonos-elements-gray-800);position:absolute;font-size:16px;line-height:16px;display:inline-block;-webkit-filter:blur(0);filter:blur(0);-webkit-transform-origin:left top;transform-origin:left top;-webkit-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);margin-left:16px;top:calc(50% - 8px);z-index:1}.sc-zonos-stripe-input-h .zonos--floated-label.sc-zonos-stripe-input::after{content:\"\";position:absolute;left:0;right:0;top:0;bottom:0;border-radius:var(--zonos--border-radius)}.sc-zonos-stripe-input-h .disabled.sc-zonos-stripe-input .zonos--floated-label.sc-zonos-stripe-input{pointer-events:inherit}.sc-zonos-stripe-input-h .disabled.sc-zonos-stripe-input .zonos--floated-label.sc-zonos-stripe-input::after{cursor:not-allowed;z-index:1}.dark.sc-zonos-stripe-input-h .zonos--label-wrapper.sc-zonos-stripe-input{background:#30313d}";

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const zonosStore = require('./zonosStore-1c517e55.js');
+const zonosStore = require('./zonosStore-0662b95f.js');
 const classes = require('./classes-b7918f56.js');
 const isColorVariable = require('./isColorVariable-525dbfa7.js');
 const styles = require('./styles-d1e64fb9.js');

package/dist/cjs/zonos-v-stack.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b1f95d96.js');
-const zonosStore = require('./zonosStore-1c517e55.js');
+const zonosStore = require('./zonosStore-0662b95f.js');
 const classes = require('./classes-b7918f56.js');
 require('./VarianceTest-bec00ea8.js');
 

package/dist/cjs/{zonosStore-1c517e55.js → zonosStore-0662b95f.js}

@@ -2928,6 +2928,7 @@ const { dispose: zonosStoreDispose, onChange: zonosStoreOnChange, reset, state:
         productTitleElementSelector: '',
         restrictionBehavior: 'DISABLED',
         visibilityStatus: 'ENABLED',
+        widgetSize: null,
     },
     loadedConfig: false,
     onlineStoreSettings: {

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

@@ -14,7 +14,7 @@ import { handleFetch } from "../../../utils/handleFetch";
 import { jsonParse } from "../../../utils/jsonParse";
 import { allLogs, log } from "../../../utils/logging/log";
 import { sendErrorLog } from "../../../utils/logging/sendErrorLog";
-import { submitGtag, } from "../../../utils/submitGtag";
+import { submitAnalytics } from "../../../utils/submitAnalytics";
 // eslint-disable-next-line no-relative-import-paths/no-relative-import-paths
 import RemoveIcon from "./assets/RemoveIcon.svg";
 /* Need to use relative import because inline-svg-stencil couldn't resolve absolute path */
@@ -386,7 +386,7 @@ export class ZonosCheckoutFinish {
                 window.history.replaceState({}, '', url.toString());
                 // Payment doesn't go through
                 if (error && (messages === null || messages === void 0 ? void 0 : messages.length)) {
-                    submitGtag({
+                    submitAnalytics({
                         event: 'zonos-checkout-payment-fail',
                         metadata: {
                             checkoutSessionId: storageStore.checkoutSessionId,
@@ -407,14 +407,14 @@ export class ZonosCheckoutFinish {
                     // Save new order info in case the user reloads before we get order info
                     this.saveOrderIdForDuplicationIssue();
                     const checkoutSessionId = storageStore.checkoutSessionId;
-                    submitGtag({
+                    submitAnalytics({
                         event: 'zonos-checkout-success',
                         metadata: this.buildPurchaseMetadata({
                             checkoutSessionId: checkoutSessionId || '',
                             currency: currency === null || currency === void 0 ? void 0 : currency.toUpperCase(),
                         }),
                     });
-                    submitGtag({
+                    submitAnalytics({
                         event: 'purchase',
                         metadata: this.buildPurchaseMetadata({
                             checkoutSessionId: checkoutSessionId || '',
@@ -466,13 +466,13 @@ export class ZonosCheckoutFinish {
             // show success message right away when order id is already created
             this.isLoading = false;
             if (paypalStore.orderIdCreated) {
-                submitGtag({
+                submitAnalytics({
                     event: 'zonos-checkout-success',
                     metadata: this.buildPurchaseMetadata({
                         checkoutSessionId: storageStore.checkoutSessionId || '',
                     }),
                 });
-                submitGtag({
+                submitAnalytics({
                     event: 'purchase',
                     metadata: this.buildPurchaseMetadata({
                         checkoutSessionId: storageStore.checkoutSessionId || '',
@@ -503,13 +503,13 @@ export class ZonosCheckoutFinish {
             this.isLoading = false;
             if (storeCreditStore.orderIdCreated) {
                 const checkoutSessionId = storageStore.checkoutSessionId;
-                submitGtag({
+                submitAnalytics({
                     event: 'zonos-checkout-success',
                     metadata: this.buildPurchaseMetadata({
                         checkoutSessionId: checkoutSessionId || '',
                     }),
                 });
-                submitGtag({
+                submitAnalytics({
                     event: 'purchase',
                     metadata: this.buildPurchaseMetadata({
                         checkoutSessionId: checkoutSessionId || '',
@@ -583,11 +583,11 @@ export class ZonosCheckoutFinish {
     }
     render() {
         const isTestMode = getIsTestMode();
-        return (h(Host, { key: '52582ef091037ac1fda75df03ae6b54ffaecb06b', class: "zonos--checkout-finish zonos--elements", style: {
+        return (h(Host, { key: '97291e81aef62884ec0519d93dcc7ff184b2913d', class: "zonos--checkout-finish zonos--elements", style: {
                 '--zonos--border-radius': getBorderRadius({
                     overrideBorderStyle: this.borderRadius,
                 }),
-            } }, this.isImmediateRedirecting && (h("div", { key: '3b0f1089e87e0a82539e9f3e25447b3b4f50cb8f', class: "loading-wrapper" }, h("zonos-spinner", { key: 'fa6f61d8b496b90af9c2a8feb1a89df0fb784827', size: 48 }))), !this.isLoading && !this.isImmediateRedirecting && (h("div", { key: '94cf155bd31b1806cc96f88ff504b870dfe4e661', class: "zonos--finish-details" }, h("div", { key: 'f103079e27fa441467e16fb0dc0ac2ba1a69ed64', 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", { key: '8d85373cbaf7ab2e3372889f07e55e6546e13b72', class: "zonos--title", type: "semiBoldSubheader" }, this.notificationTitle), h("zonos-text", { key: 'cf120f43b009bfa2af326548b89d8139a2e0d954', class: "zonos--subtitle", textColor: "gray-600" }, this.notificationMessages.map(message => (h(Fragment, null, message, h("br", null))))), this.shouldRenderCloseButtonForRedirectBehavior() && (h("zonos-button", { key: '10c9b15539d63c502dc8a8d6ccbd6f927dd24cc1',
+            } }, this.isImmediateRedirecting && (h("div", { key: '40569271fb67acb22a4a0fa3c0fc8e1c0c641061', class: "loading-wrapper" }, h("zonos-spinner", { key: '8b431c7751e5e32fe97f4244151ece7de3c6d9bc', size: 48 }))), !this.isLoading && !this.isImmediateRedirecting && (h("div", { key: '0f5c89c285acf8c4f79e058c69cde9011df7e1a2', class: "zonos--finish-details" }, h("div", { key: '7491b15a90941476338ec6b1738312ffd4ebd2c0', 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", { key: '87e0d022014596b02d813ee510917b7ec9b55e09', class: "zonos--title", type: "semiBoldSubheader" }, this.notificationTitle), h("zonos-text", { key: '456bd678d5ba6f5b74da34f906bbe9f4bed870ac', class: "zonos--subtitle", textColor: "gray-600" }, this.notificationMessages.map(message => (h(Fragment, null, message, h("br", null))))), this.shouldRenderCloseButtonForRedirectBehavior() && (h("zonos-button", { key: 'ebde02a73e71ad88d7d68629f2cd8a34d961aa63',
             // Only show loading spinner if it's not an error notification
             loading: this.isWaitingToRedirect &&
                 this.notificationType !== 'error', onClick: () => {
@@ -599,9 +599,9 @@ export class ZonosCheckoutFinish {
                 }
                 this.closeClickHandler();
             }, size: "md", variant: "primary" }, translate('Close'))), !window.Zonos.isLegacyCheckout &&
-            this.shouldRenderKeepShoppingButton() && (h("zonos-button", { key: 'b2fc437d0bd21d38ad09cdcdf8b5907b7604ed31', onClick: () => this.closeClickHandler(), size: "md", variant: "primary" }, this.notificationActionText))), isTestMode &&
+            this.shouldRenderKeepShoppingButton() && (h("zonos-button", { key: '2b86a3d9fb705ad080af532e645fd26aa844a14a', onClick: () => this.closeClickHandler(), size: "md", variant: "primary" }, this.notificationActionText))), isTestMode &&
             cartStore.step === 'finish' &&
-            this.notificationType === 'success' && (h("div", { key: '6c1258c8d66d5127a14ae3ee5eb5477127a395aa', class: "zonos--finish-button-wrapper" }, h("zonos-button", { key: 'b3e0a8bf9eb0026595552563fd036a1894c726f8', backgroundColor: "gray-0", buttonColor: "gray-1000", onClick: () => this.closeClickHandler(), size: "lg", variant: "outline" }, "New test cart"), h("zonos-button", { key: 'c66ff9fb1998318eaa518c053998de662e53abff', onClick: () => {
+            this.notificationType === 'success' && (h("div", { key: '83a9dc9fb81baaf9e223dfa9fe0fc0fc4c106635', class: "zonos--finish-button-wrapper" }, h("zonos-button", { key: 'edf8057b0430e3e4bb8fd675554659781e1724ae', backgroundColor: "gray-0", buttonColor: "gray-1000", onClick: () => this.closeClickHandler(), size: "lg", variant: "outline" }, "New test cart"), h("zonos-button", { key: '3c40eee58d8a2ad5951dfdfc7c8d485052b6ba73', onClick: () => {
                 const isZonosDashboard = window.location.hostname.includes('dashboard.zonos.com');
                 this.redirectToUrl(isZonosDashboard
                     ? '/orders/all'

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

@@ -95,4 +95,11 @@
 :host .zonos--test-cards {
   margin-top: auto;
   padding-top: 16px;
+}
+
+:host(.mobile.mobile) {
+  overscroll-behavior: auto;
+}
+:host(.mobile.mobile) .zonos--group {
+  overscroll-behavior: auto;
 }

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

@@ -10,9 +10,10 @@ import { placeTestOrder } from "../../../utils/api/placeTestOrder";
 import { getIsStagingMode } from "../../../utils/checkout/getIsStagingMode";
 import { getIsTestMode } from "../../../utils/checkout/getIsTestMode";
 import { renderCheckoutCurrency } from "../../../utils/checkout/renderCheckoutCurrency";
+import { classes } from "../../../utils/classes";
 import { isDarkColor } from "../../../utils/isDarkColor";
 import { log } from "../../../utils/logging/log";
-import { submitGtag } from "../../../utils/submitGtag";
+import { submitAnalytics } from "../../../utils/submitAnalytics";
 // eslint-disable-next-line no-relative-import-paths/no-relative-import-paths
 import CheckmarkLineIcon from "./assets/CheckmarkLineIcon.svg";
 // eslint-disable-next-line no-relative-import-paths/no-relative-import-paths
@@ -68,7 +69,7 @@ export class ZonosCheckoutPayment {
             }
             stripeStore.checkoutSettlementCurrency = currencyCode;
             // submit google tag when the form is complete
-            submitGtag({
+            submitAnalytics({
                 event: 'zonos-checkout-payment-info',
                 metadata: {
                     checkoutSessionId: storageStore.checkoutSessionId,
@@ -196,7 +197,10 @@ export class ZonosCheckoutPayment {
                     display: isPaypalTabSelected ? 'block' : 'none',
                 } }))), isTestMode && (h("zonos-card", { backgroundColor: "gray-100", borderRadius: 12, class: "zonos--test-cards" }, h("zonos-v-stack", { spacing: 16 }, h("div", null, h("zonos-text", { type: "semiBoldLabel" }, translate('Test cards')), h("zonos-text", { textColor: "gray-700" }, translate('Click to copy the card number. Use any future expiration date and three number CVC.'))), h("zonos-button", { icon: h("zonos-icon", { content: CheckmarkLineIcon }), justifyContent: "flex-start", onClick: () => this.copyCardToClipboard('4242424242424242') }, translate('Success'), " (****4242)"), h("zonos-button", { icon: h("zonos-icon", { content: RemoveLineIcon }), justifyContent: "flex-start", onClick: () => this.copyCardToClipboard('4000000000000002') }, translate('Failure'), " (****0002)")), h("zonos-notification", null)))));
         };
-        return (h(Host, { class: "zonos--checkout-payment zonos--elements" }, h("div", { class: "zonos--group" }, h("zonos-text", { class: "zonos--title", type: "semiBoldSubheader" }, translate('Payment method')), renderPayment())));
+        return (h(Host, { class: classes([
+                'zonos--checkout-payment zonos--elements',
+                this.isMobile && 'mobile',
+            ]) }, h("div", { class: "zonos--group" }, h("zonos-text", { class: "zonos--title", type: "semiBoldSubheader" }, translate('Payment method')), renderPayment())));
     }
     static get is() { return "zonos-checkout-payment"; }
     static get encapsulation() { return "scoped"; }