@zonos/elements 1.3.5-alpha.0 → 1.3.6

package/dist/components/zonos-select-dialog-header.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface ZonosSelectDialogHeader extends Components.ZonosSelectDialogHeader, HTMLElement {}
+export const ZonosSelectDialogHeader: {
+    prototype: ZonosSelectDialogHeader;
+    new (): ZonosSelectDialogHeader;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/zonos-select-dialog-header.js

@@ -0,0 +1,6 @@
+import { Z as ZonosSelectDialogHeader$1, d as defineCustomElement$1 } from './zonos-select-dialog-header2.js';
+
+const ZonosSelectDialogHeader = ZonosSelectDialogHeader$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ZonosSelectDialogHeader, defineCustomElement };

package/dist/components/zonos-select-dialog-header2.js

@@ -0,0 +1,71 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { a as zonosStoreFontFamily } from './zonosStore.js';
+import { d as defineCustomElement$5 } from './zonos-button2.js';
+import { d as defineCustomElement$4 } from './zonos-icon2.js';
+import { d as defineCustomElement$3 } from './zonos-spinner2.js';
+import { d as defineCustomElement$2 } from './zonos-text2.js';
+import { d as defineCustomElement$1 } from './zonos-v-stack2.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>`;
+
+const zonosSelectDialogHeaderCss = ":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 .zonos--select-dialog-header-wrapper{position:-webkit-sticky;position:sticky;top:0;background:var(--amino-surface-color);padding:var(--amino-space-16)}:host .zonos--select-dialog-header-wrapper .zonos--select-dialog-header{position:relative;-ms-flex-pack:justify;justify-content:space-between;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}";
+const ZonosSelectDialogHeaderStyle0 = zonosSelectDialogHeaderCss;
+
+const ZonosSelectDialogHeader = /*@__PURE__*/ proxyCustomElement(class ZonosSelectDialogHeader extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.handleOnClose = () => { };
+        this.label = '';
+    }
+    render() {
+        return (h(Host, { key: '737dcae414b2538bf4c0b5c932a78acb9eeb1e93', class: "zonos--elements", style: {
+                '--font-family': zonosStoreFontFamily(),
+            } }, h("zonos-v-stack", { key: '8cfde0f03e03ad011c8f8f4517c3b47ba8c03746', class: "zonos--select-dialog-header-wrapper", spacing: 8 }, h("div", { key: '5c5044ad46e156ad4cde26df0bb57c6690a11e42', class: "zonos--select-dialog-header" }, h("zonos-text", { key: 'a10b9b48834c6eabd9d20f44b8c8dc4927d53bd1', type: "boldLabel" }, this.label), h("zonos-button", { key: '50d74c5e97f2c224a437fde48b6d2a30b14fc1fe', class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close select dialog", content: RemoveIcon, size: 20 }), noBackground: true, onClick: () => this.handleOnClose() })), h("slot", { key: 'd875d9cfddaf37f1ca0a2bb01a3ba3da10c2fda0' }))));
+    }
+    static get style() { return ZonosSelectDialogHeaderStyle0; }
+}, [1, "zonos-select-dialog-header", {
+        "handleOnClose": [16],
+        "label": [1]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["zonos-select-dialog-header", "zonos-button", "zonos-icon", "zonos-spinner", "zonos-text", "zonos-v-stack"];
+    components.forEach(tagName => { switch (tagName) {
+        case "zonos-select-dialog-header":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, ZonosSelectDialogHeader);
+            }
+            break;
+        case "zonos-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "zonos-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "zonos-spinner":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "zonos-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "zonos-v-stack":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { ZonosSelectDialogHeader as Z, defineCustomElement as d };

package/dist/components/zonos-shipping-rich-radio2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { b as zonosStoreFontFamily, z as zonosStore } from './zonosStore.js';
+import { a as zonosStoreFontFamily, z as zonosStore } from './zonosStore.js';
 import { c as classes } from './classes.js';
 import { g as getBorderRadius } from './getBorderRadius.js';
 import { i as isColorVariable } from './isColorVariable.js';
@@ -43,7 +43,7 @@ const ZonosShippingRichRadio = /*@__PURE__*/ proxyCustomElement(class ZonosShipp
             return (h("div", { "aria-hidden": "true", class: classes([
                     'zonos--shipping-rich-radio-item',
                     selected && 'selected',
-                ]), onClick: () => this.handleRichRadioSelect(item) }, h("input", { checked: selected, class: "zonos--shipping-rich-radio-input", name: "zonos--shipping-rich-radio", type: "radio", value: item.value }), h("div", { class: "zonos--shipping-info" }, h("div", { class: "zonos--shipping-detail" }, h("zonos-text", { class: "zonos--shipping-label", type: "label" }, item.label), (item.sublabel || item.caption) && (h("div", { class: "zonos--sub-detail" }, item.sublabel && (h("zonos-text", { color: "gray-800" }, item.sublabel)), item.caption && (h("zonos-text", { color: "gray-400" }, item.caption))))), h("zonos-text", { type: "semiBoldLabel" }, item.price))));
+                ]), onClick: () => this.handleRichRadioSelect(item) }, h("input", { checked: selected, class: "zonos--shipping-rich-radio-input", name: "zonos--shipping-rich-radio", type: "radio", value: item.value }), h("div", { class: "zonos--shipping-info" }, h("div", { class: "zonos--shipping-detail" }, h("zonos-text", { class: "zonos--shipping-label", type: "label" }, item.label), (item.sublabel || item.caption) && (h("div", { class: "zonos--sub-detail" }, item.sublabel && (h("zonos-text", { textColor: "gray-800" }, item.sublabel)), item.caption && (h("zonos-text", { textColor: "gray-400" }, item.caption))))), h("zonos-text", { type: "semiBoldLabel" }, item.price))));
         })));
     }
     static get style() { return ZonosShippingRichRadioStyle0; }

package/dist/components/zonos-shipping2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { c as cartStore, i as cartStoreUpdateSelectedShippingOption, b as cartStoreGetShippingTransitInfo } from './cart.js';
+import { c as cartStore, m as cartStoreUpdateSelectedShippingOption, n as cartStoreGetShippingTransitInfo } from './stripe.js';
 import { t as translate } from './localization.js';
 import { f as formatCurrency } from './formatCurrency.js';
 import { s as submitGtag } from './submitGtag.js';
@@ -9,7 +9,7 @@ import { d as defineCustomElement$3 } from './zonos-shipping-rich-radio2.js';
 import { d as defineCustomElement$2 } from './zonos-spinner2.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
 
-const zonosShippingCss = ".sc-zonos-shipping-h{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-shipping-h *.sc-zonos-shipping{font-family:var(--font-family, Inter), Inter}.sc-zonos-shipping-h img.sc-zonos-shipping{max-width:100%}.sc-zonos-shipping-h dl.sc-zonos-shipping,.sc-zonos-shipping-h dd.sc-zonos-shipping,.sc-zonos-shipping-h h1.sc-zonos-shipping,.sc-zonos-shipping-h h2.sc-zonos-shipping,.sc-zonos-shipping-h h3.sc-zonos-shipping,.sc-zonos-shipping-h h4.sc-zonos-shipping,.sc-zonos-shipping-h h5.sc-zonos-shipping,.sc-zonos-shipping-h h6.sc-zonos-shipping,.sc-zonos-shipping-h hr.sc-zonos-shipping,.sc-zonos-shipping-h figure.sc-zonos-shipping,.sc-zonos-shipping-h p.sc-zonos-shipping,.sc-zonos-shipping-h pre.sc-zonos-shipping{margin:0}.sc-zonos-shipping-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-shipping-h{overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.sc-zonos-shipping-h .zonos--title.sc-zonos-shipping{margin-bottom:var(--amino-space-24)}.sc-zonos-shipping-h .zonos--shipping-method-title.sc-zonos-shipping{margin-bottom:var(--amino-space-16)}.sc-zonos-shipping-h .zonos-shipping-rich-radio.sc-zonos-shipping{margin-bottom:var(--amino-space-24)}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping{margin-bottom:var(--amino-space-20);overflow:auto;padding:5px}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar{width:10px}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar-track{background:var(--amino-gray-50)}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar-thumb:hover{background:#d6d6d6}.sc-zonos-shipping-h .zonos--group-btn.sc-zonos-shipping{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}.sc-zonos-shipping-h .zonos--group-btn.sc-zonos-shipping zonos-button.sc-zonos-shipping{width:calc(100% - 10px)}.sc-zonos-shipping-h zonos-banner.sc-zonos-shipping{margin-top:var(--amino-space-24)}";
+const zonosShippingCss = ".sc-zonos-shipping-h{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-shipping-h *.sc-zonos-shipping{font-family:var(--font-family, Inter), Inter}.sc-zonos-shipping-h img.sc-zonos-shipping{max-width:100%}.sc-zonos-shipping-h dl.sc-zonos-shipping,.sc-zonos-shipping-h dd.sc-zonos-shipping,.sc-zonos-shipping-h h1.sc-zonos-shipping,.sc-zonos-shipping-h h2.sc-zonos-shipping,.sc-zonos-shipping-h h3.sc-zonos-shipping,.sc-zonos-shipping-h h4.sc-zonos-shipping,.sc-zonos-shipping-h h5.sc-zonos-shipping,.sc-zonos-shipping-h h6.sc-zonos-shipping,.sc-zonos-shipping-h hr.sc-zonos-shipping,.sc-zonos-shipping-h figure.sc-zonos-shipping,.sc-zonos-shipping-h p.sc-zonos-shipping,.sc-zonos-shipping-h pre.sc-zonos-shipping{margin:0}.sc-zonos-shipping-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-shipping-h{overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.sc-zonos-shipping-h .zonos--title.sc-zonos-shipping{margin-bottom:var(--amino-space-24)}.sc-zonos-shipping-h .zonos--shipping-method-title.sc-zonos-shipping{margin-bottom:var(--amino-space-16)}.sc-zonos-shipping-h .zonos-shipping-rich-radio.sc-zonos-shipping{margin-bottom:var(--amino-space-24)}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping{margin-bottom:var(--amino-space-20);overflow:auto;padding:5px}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar{width:10px}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar-track{background:var(--amino-gray-50)}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}.sc-zonos-shipping-h .zonos--group.sc-zonos-shipping::-webkit-scrollbar-thumb:hover{background:#d6d6d6}.sc-zonos-shipping-h .zonos--group-btn.sc-zonos-shipping{position:-webkit-sticky;position:sticky;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;bottom:0;margin-top:var(--amino-space-12);background:var(--primary-color, var(--amino-gray-0))}.sc-zonos-shipping-h .zonos--group-btn.sc-zonos-shipping zonos-button.sc-zonos-shipping{width:100%}.sc-zonos-shipping-h zonos-banner.sc-zonos-shipping{margin-top:var(--amino-space-24)}";
 const ZonosShippingStyle0 = zonosShippingCss;
 
 const ZonosShipping = /*@__PURE__*/ proxyCustomElement(class ZonosShipping extends HTMLElement {
@@ -75,9 +75,9 @@ const ZonosShipping = /*@__PURE__*/ proxyCustomElement(class ZonosShipping exten
                 value: item.id,
             };
         });
-        return (h(Host, { class: "zonos--shipping zonos--elements" }, h("div", { class: "zonos--group" }, h("zonos-text", { class: "zonos--title", type: "semiBoldSubheader" }, translate('Shipping information')), h("zonos-text", { class: "zonos--shipping-method-title", type: "semiBoldLabel" }, translate('Shipping method')), !(serviceLevels === null || serviceLevels === void 0 ? void 0 : serviceLevels.length) ? (h("zonos-banner", { bannerTitle: "No shipping methods found - try editing your address or contacting support if the error persists", intent: "error" })) : (h("zonos-shipping-rich-radio", { items: serviceLevels || [], onRadioSelected: e => this.handleRadioSelected(e) }))), h("zonos-button", { backgroundColor: this.submitBtnColor, "is-disabled": this.disabled, loading: this.continueLoading, onClick: () => this.continueClickHandler(), size: "lg",
+        return (h(Host, { class: "zonos--shipping zonos--elements" }, h("div", { class: "zonos--group" }, h("zonos-text", { class: "zonos--title", type: "semiBoldSubheader" }, translate('Shipping information')), h("zonos-text", { class: "zonos--shipping-method-title", type: "semiBoldLabel" }, translate('Shipping method')), !(serviceLevels === null || serviceLevels === void 0 ? void 0 : serviceLevels.length) ? (h("zonos-banner", { bannerTitle: "No shipping methods found - try editing your address or contacting support if the error persists", intent: "error" })) : (h("zonos-shipping-rich-radio", { items: serviceLevels || [], onRadioSelected: e => this.handleRadioSelected(e) })), h("div", { class: "zonos--group-btn" }, h("zonos-button", { backgroundColor: this.submitBtnColor, isDisabled: this.disabled, loading: this.continueLoading, onClick: () => this.continueClickHandler(), size: "lg",
             // use primary type when on mobile mode
-            variant: this.submitBtnType }, translate('Go to payment'))));
+            variant: this.submitBtnType }, translate('Go to payment'))))));
     }
     static get watchers() { return {
         "disabled": ["watchFormComplete"]

package/dist/components/zonos-spinner2.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { c as classes } from './classes.js';
 
-const zonosSpinnerCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{position:relative;overflow:hidden;width:var(--size);height:var(--size);display:-ms-inline-flexbox;display:inline-flex}:host svg{width:var(--size);height:var(--size);stroke:var(--amino-blue-600);-webkit-animation:rotate 2s linear infinite;animation:rotate 2s linear infinite}:host circle.track{stroke:var(--amino-gray-200)}:host.black{stroke:var(--amino-spinner-stroke-black)}:host.black circle.track{stroke:var(--amino-spinner-track-black)}:host.white{stroke:var(--amino-spinner-stroke-white)}:host.white circle.track{stroke:var(--amino-spinner-track-white)}:host.info{stroke:var(--amino-blue-600)}:host.info circle.track{stroke:var(--amino-blue-100)}:host.success{stroke:var(--amino-green-600)}:host.success circle.track{stroke:var(--amino-green-100)}:host.danger{stroke:var(--amino-red-600)}:host.danger circle.track{stroke:var(--amino-red-100)}:host.warning{stroke:var(--amino-orange-600)}:host.warning circle.track{stroke:var(--amino-orange-100)}@-webkit-keyframes rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes dash{0%{stroke-dasharray:1, 150;stroke-dashoffset:0}50%{stroke-dasharray:90, 150;stroke-dashoffset:-35}100%{stroke-dasharray:90, 150;stroke-dashoffset:-124}}@keyframes dash{0%{stroke-dasharray:1, 150;stroke-dashoffset:0}50%{stroke-dasharray:90, 150;stroke-dashoffset:-35}100%{stroke-dasharray:90, 150;stroke-dashoffset:-124}}:host circle:not(.track){stroke-linecap:round;-webkit-animation:dash 1.5s ease-in-out infinite;animation:dash 1.5s ease-in-out infinite}";
+const zonosSpinnerCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{position:relative;overflow:hidden;width:var(--size);height:var(--size);display:-ms-inline-flexbox;display:inline-flex}:host svg{width:var(--size);height:var(--size);stroke:var(--amino-blue-600);-webkit-animation:rotate 2s linear infinite;animation:rotate 2s linear infinite}:host circle.track{stroke:var(--amino-gray-200)}@-webkit-keyframes rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes dash{0%{stroke-dasharray:1, 150;stroke-dashoffset:0}50%{stroke-dasharray:90, 150;stroke-dashoffset:-35}100%{stroke-dasharray:90, 150;stroke-dashoffset:-124}}@keyframes dash{0%{stroke-dasharray:1, 150;stroke-dashoffset:0}50%{stroke-dasharray:90, 150;stroke-dashoffset:-35}100%{stroke-dasharray:90, 150;stroke-dashoffset:-124}}:host circle:not(.track){stroke-linecap:round;-webkit-animation:dash 1.5s ease-in-out infinite;animation:dash 1.5s ease-in-out infinite}:host(.black) circle{stroke:var(--amino-spinner-stroke-black)}:host(.black) circle.track{stroke:var(--amino-spinner-track-black)}:host(.white) circle{stroke:var(--amino-spinner-stroke-white)}:host(.white) circle.track{stroke:var(--amino-spinner-track-white)}:host(.info) circle{stroke:var(--amino-blue-600)}:host(.info) circle.track{stroke:var(--amino-blue-100)}:host(.success) circle{stroke:var(--amino-green-600)}:host(.success) circle.track{stroke:var(--amino-green-100)}:host(.danger) circle{stroke:var(--amino-red-600)}:host(.danger) circle.track{stroke:var(--amino-red-100)}:host(.warning) circle{stroke:var(--amino-orange-600)}:host(.warning) circle.track{stroke:var(--amino-orange-100)}";
 const ZonosSpinnerStyle0 = zonosSpinnerCss;
 
 const ZonosSpinner = /*@__PURE__*/ proxyCustomElement(class ZonosSpinner extends HTMLElement {
@@ -10,13 +10,13 @@ const ZonosSpinner = /*@__PURE__*/ proxyCustomElement(class ZonosSpinner extends
         this.__registerHost();
         this.__attachShadow();
         this.size = 32;
-        this.color = undefined;
+        this.spinnerColor = undefined;
     }
     render() {
         if (!this.el.shadowRoot) {
             return null;
         }
-        return (h(Host, { class: classes(['zonos--elements', this.color]), style: {
+        return (h(Host, { class: classes(['zonos--elements', this.spinnerColor]), style: {
                 '--size': `${this.size}px`,
             } }, h("svg", { viewBox: "0 0 50 50" }, h("circle", { class: "track", cx: "25", cy: "25", fill: "none", id: "loading-spinner-circle", r: "20", "stroke-width": "5" }), h("circle", { cx: "25", cy: "25", fill: "none", id: "loading-spinner-circle", r: "20", "stroke-width": "5" }))));
     }
@@ -24,7 +24,7 @@ const ZonosSpinner = /*@__PURE__*/ proxyCustomElement(class ZonosSpinner extends
     static get style() { return ZonosSpinnerStyle0; }
 }, [1, "zonos-spinner", {
         "size": [2],
-        "color": [1]
+        "spinnerColor": [1, "spinner-color"]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/components/zonos-text2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { b as zonosStoreFontFamily } from './zonosStore.js';
+import { a as zonosStoreFontFamily } from './zonosStore.js';
 import { c as classes } from './classes.js';
 
 const textOptions = {
@@ -110,8 +110,7 @@ const ZonosText = /*@__PURE__*/ proxyCustomElement(class ZonosText extends HTMLE
         super();
         this.__registerHost();
         this.__attachShadow();
-        this.class = '';
-        this.color = 'gray-1200';
+        this.textColor = 'gray-1200';
         this.size = undefined;
         this.type = 'body';
         this.weight = undefined;
@@ -147,16 +146,14 @@ const ZonosText = /*@__PURE__*/ proxyCustomElement(class ZonosText extends HTMLE
         return (h(Host, { class: classes([
                 `zonos--text-size-${textSize}`,
                 `zonos--text-weight-${textWeight}`,
-                this.class,
             ]), style: {
-                '--color': this.color ? `var(--amino-${this.color})` : '',
+                '--color': this.textColor ? `var(--amino-${this.textColor})` : '',
                 '--font-family': zonosStoreFontFamily(),
             } }, renderText()));
     }
     static get style() { return ZonosTextStyle0; }
 }, [1, "zonos-text", {
-        "class": [1],
-        "color": [1],
+        "textColor": [1, "text-color"],
         "size": [1],
         "type": [1],
         "weight": [2],

package/dist/components/zonos-tooltip.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface ZonosTooltip extends Components.ZonosTooltip, HTMLElement {}
+export const ZonosTooltip: {
+    prototype: ZonosTooltip;
+    new (): ZonosTooltip;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/zonos-tooltip.js

@@ -0,0 +1,6 @@
+import { Z as ZonosTooltip$1, d as defineCustomElement$1 } from './zonos-tooltip2.js';
+
+const ZonosTooltip = ZonosTooltip$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ZonosTooltip, defineCustomElement };

package/dist/components/zonos-tooltip2.js

@@ -0,0 +1,48 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { c as classes } from './classes.js';
+import { d as defineCustomElement$1 } from './zonos-text2.js';
+
+const zonosTooltipCss = ":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 .zonos--tooltip{position:relative}:host .zonos--tooltip .zonos--tooltip-content{position:absolute;bottom:100%;left:0;width:-webkit-max-content;width:-moz-max-content;width:max-content;padding:var(--amino-space-12);background-color:var(--amino-gray-1200);opacity:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;-webkit-transform-origin:bottom left;transform-origin:bottom left;border-radius:var(--amino-radius-4);z-index:100;-webkit-box-shadow:var(--amino-v3-shadow-large);box-shadow:var(--amino-v3-shadow-large)}:host .zonos--tooltip .zonos--tooltip-content.zonos--show-tooltip{opacity:1;-webkit-transform:scale(1);transform:scale(1)}";
+const ZonosTooltipStyle0 = zonosTooltipCss;
+
+const ZonosTooltip = /*@__PURE__*/ proxyCustomElement(class ZonosTooltip extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.label = '';
+        this.subtitle = '';
+        this.showTooltip = false;
+    }
+    render() {
+        return (h(Host, { key: '684561bebf9385c7e6bcca7de37e7ee5084c9692', class: "zonos--elements" }, h("div", { key: 'c116738f39d25b856b268ece410a33f91046c739', class: "zonos--tooltip", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, h("slot", { key: '4073ed0766b4efaa0c25fa7febdbad4c42714dca' }), h("div", { key: '8c6b180577830aaaceb629819535dd930fc49e02', class: classes([
+                this.showTooltip && 'zonos--show-tooltip',
+                'zonos--tooltip-content',
+            ]) }, h("zonos-text", { key: '7c018a9d5a7db939b59624dcc77029a5a8d621af', color: "gray-0", size: "s", type: "boldLabel" }, this.label), h("zonos-text", { key: 'c1f09eaf9cb1084ecf47334903b9ca8b944502b7', color: "gray-0", size: "xs" }, this.subtitle)))));
+    }
+    static get style() { return ZonosTooltipStyle0; }
+}, [1, "zonos-tooltip", {
+        "label": [1],
+        "subtitle": [1],
+        "showTooltip": [32]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["zonos-tooltip", "zonos-text"];
+    components.forEach(tagName => { switch (tagName) {
+        case "zonos-tooltip":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, ZonosTooltip);
+            }
+            break;
+        case "zonos-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { ZonosTooltip as Z, defineCustomElement as d };

package/dist/components/zonos-v-stack2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { b as zonosStoreFontFamily } from './zonosStore.js';
+import { a as zonosStoreFontFamily } from './zonosStore.js';
 import { c as classes } from './classes.js';
 
 const zonosVStackCss = ":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 .vstack{display:grid;grid-auto-columns:minmax(0, 1fr);grid-row-gap:var(--spacing, 24px);grid-auto-flow:row}";
@@ -11,17 +11,15 @@ const VStack = /*@__PURE__*/ proxyCustomElement(class VStack extends HTMLElement
         this.__registerHost();
         this.__attachShadow();
         this.spacing = 24;
-        this.class = '';
     }
     render() {
-        return (h(Host, { key: 'd363ffeb2bbae49e7318b26ab56b4b8871844daf', style: {
+        return (h(Host, { key: 'a26c7c4898b81deb569731adb63505ded3155fdf', style: {
                 '--font-family': zonosStoreFontFamily(),
-            } }, h("div", { key: '5d9fa5ae9ffca787ca42f38e4ec75fedc24823f9', class: classes(['vstack', this.class]), style: { 'grid-row-gap': `${this.spacing}px` } }, h("slot", { key: 'e1d6fef3378b92c18c2c43ec8616e8c733a4290c' }))));
+            } }, h("div", { key: 'd4af21dc024bbd12b5240dff4f2689416ad4d808', class: classes(['vstack']), style: { 'grid-row-gap': `${this.spacing}px` } }, h("slot", { key: '298de42d875520fad5a720eedcf2b8664b39ae85' }))));
     }
     static get style() { return ZonosVStackStyle0; }
 }, [1, "zonos-v-stack", {
-        "spacing": [2],
-        "class": [1]
+        "spacing": [2]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/components/zonosStore.js

@@ -2857,4 +2857,4 @@ const zonosStoreFontFamily = () => {
     return fontFamily;
 };
 
-export { _root as _, commonjsGlobal as a, zonosStoreFontFamily as b, createStore as c, zonosStoreInitSetting as d, _baseGetTag as e, isObject_1 as f, isObjectLike_1 as i, mergeConfig as m, zonosStore as z };
+export { _root as _, zonosStoreFontFamily as a, commonjsGlobal as b, createStore as c, zonosStoreInitSetting as d, _baseGetTag as e, isObject_1 as f, isObjectLike_1 as i, mergeConfig as m, zonosStore as z };

package/dist/esm/ILanguage-97790bee.js

@@ -0,0 +1,24 @@
+const languages = [
+    { code: 'en', label: 'English', translatedLabel: 'English' },
+    { code: 'es', label: 'Spanish', translatedLabel: 'Español' },
+    { code: 'pt', label: 'Portuguese', translatedLabel: 'Português' },
+    { code: 'ru', label: 'Russian', translatedLabel: 'русский' },
+    { code: 'da', label: 'Danish', translatedLabel: 'dansk' },
+    { code: 'it', label: 'Italian', translatedLabel: 'Italiano' },
+    { code: 'pl', label: 'Polish', translatedLabel: 'Polskie' },
+    { code: 'ar', label: 'Arabic', translatedLabel: 'عربى' },
+    { code: 'de', label: 'German', translatedLabel: 'Deutsche' },
+    { code: 'ja', label: 'Japanese', translatedLabel: '日本語' },
+    { code: 'no', label: 'Norwegian', translatedLabel: 'norsk' },
+    { code: 'vi', label: 'Vietnamese', translatedLabel: 'Tiếng Việt' },
+    { code: 'tr', label: 'Turkish', translatedLabel: 'Türk' },
+    { code: 'he', label: 'Hebrew', translatedLabel: 'עִברִית' },
+    { code: 'fr', label: 'French', translatedLabel: 'Français' },
+    { code: 'nl', label: 'Dutch', translatedLabel: 'Nederlands' },
+    { code: 'zh', label: 'Chinese', translatedLabel: '中文' },
+    { code: 'sv', label: 'Swedish', translatedLabel: 'svenska' },
+    { code: 'id', label: 'Indonesian', translatedLabel: 'bahasa Indonesia' },
+    { code: 'ko', label: 'Korean', translatedLabel: '한국어' },
+];
+
+export { languages as l };

package/dist/esm/app-globals-0f993ce5.js

@@ -0,0 +1,3 @@
+const globalScripts = () => {};
+
+export { globalScripts as g };

package/dist/esm/{cart-ba9b0d4c.js → cart-bc3bb22e.js}

@@ -1,16 +1,34 @@
-import { z as zonosStore, c as createStore } from './zonosStore-e59617f8.js';
-import { h as handleFetch, l as log, a as localizationStore, b as logError, t as translate } from './localization-5d83fde2.js';
-import { i as isDarkColor } from './isDarkColor-8696cb70.js';
-import { g as getBorderRadius } from './getBorderRadius-9e4cb3b1.js';
+import { z as zonosStore, c as createStore } from './zonosStore-e6c7be3a.js';
+import { h as handleFetch, a as log, l as localizationStore, b as logError, t as translate } from './localization-d8f6453b.js';
+import { i as isDarkColor } from './isDarkColor-e982fa09.js';
+import { g as getBorderRadius } from './getBorderRadius-e9736f7e.js';
 
 const prepCalculateLandedCost = () => {
     // maybe we don't need email now for prefetch the landed cost
     const stripeLinkData = stripeStore.stripeLinkEventData;
     const stripeAddressData = stripeStore.stripeAddressEventData;
-    if (!stripeAddressData || !stripeAddressData.complete) {
+    const stripeBillingAddressData = stripeStore.stripeShippingSameAsBilling
+        ? stripeStore.stripeAddressEventData
+        : stripeStore.stripeBillingAddressEventData;
+    if (!(stripeAddressData === null || stripeAddressData === void 0 ? void 0 : stripeAddressData.complete) || !(stripeBillingAddressData === null || stripeBillingAddressData === void 0 ? void 0 : stripeBillingAddressData.complete)) {
         throw new Error('Missing stripe address data');
     }
     return {
+        billingAddress: {
+            addressLine1: stripeBillingAddressData.value.address.line1,
+            addressLine2: stripeBillingAddressData.value.address.line2 || '',
+            city: stripeBillingAddressData.value.address.city,
+            country: stripeBillingAddressData.value.address.country,
+            postalCode: stripeBillingAddressData.value.address.postal_code,
+            state: stripeBillingAddressData.value.address.state,
+        },
+        billingContact: {
+            // firstName and lastName should be valid now since stripe only mark
+            // the address as complete when both fields are filled.
+            firstName: stripeBillingAddressData.value.firstName || '',
+            lastName: stripeBillingAddressData.value.lastName || '',
+            phone: stripeBillingAddressData.value.phone || '',
+        },
         checkoutSessionId: cartStore.checkoutSessionId || '',
         contact: {
             email: (stripeLinkData === null || stripeLinkData === void 0 ? void 0 : stripeLinkData.value.email) || '',
@@ -33,11 +51,17 @@ const prepCalculateLandedCost = () => {
 };
 
 const triggerBuildLandedCost = async (buildLandedCost) => {
-    var _a;
+    var _a, _b, _c, _d;
     const data = prepCalculateLandedCost();
-    const landedCost = await buildLandedCost(data.checkoutSessionId, data.contact, data.shippingAddress);
-    if (!landedCost) {
-        throw new Error('Failed to build landed cost');
+    const landedCost = await buildLandedCost({
+        billingAddress: data.billingAddress,
+        billingContact: data.billingContact,
+        checkoutSessionId: data.checkoutSessionId,
+        contact: data.contact,
+        shippingAddress: data.shippingAddress,
+    });
+    if (!landedCost || ((_a = landedCost.errors) === null || _a === void 0 ? void 0 : _a.length)) {
+        throw new Error(`Failed to build landed cost: ${((_c = (_b = landedCost === null || landedCost === void 0 ? void 0 : landedCost.errors) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.message) || 'Unknown error'}`);
     }
     // Validate the landed cost object to make sure the returned value from buildLandedCost has a valid schema
     const { errors, json } = await handleFetch(`${"https://v1.route.js.zonos.com"}/api/zonos-elements/validate-landed-cost`, {
@@ -48,7 +72,7 @@ const triggerBuildLandedCost = async (buildLandedCost) => {
         method: 'POST',
     });
     if (!json || errors.length) {
-        throw new Error(`Invalid landed cost object: ${((_a = errors.find(Boolean)) === null || _a === void 0 ? void 0 : _a.message) || 'Unknown error'}`);
+        throw new Error(`Invalid landed cost object: ${((_d = errors.find(Boolean)) === null || _d === void 0 ? void 0 : _d.message) || 'Unknown error'}`);
     }
     return landedCost;
 };
@@ -122,16 +146,21 @@ const { onChange: onChange$1, reset: reset$1, state: stripeStore, } = createStor
     stripeAddressEventData: null,
     stripeAddressUsedWhenFetchingLC: null,
     stripeBillingAddressElement: null,
+    stripeBillingAddressEventData: null,
+    stripeBillingAddressUsedWhenFetchingLC: null,
     stripeElements: null,
+    stripeElementsForBillingAddress: null,
     stripeElementsOptions: null,
     stripeLinkElement: null,
     stripeLinkEventData: null,
     stripeLinkUsedWhenFetchingLC: null,
     stripePaymentElement: null,
     stripePaymentEventData: null,
+    stripeShippingSameAsBilling: true,
 }));
-const getStripeOptions = ({ clientSecret, overrideBorderRaidus, overridePrimaryColor, overrideTheme, }) => {
+const getStripeOptions = ({ clientSecret, overrideBorderRaidus, overridePrimaryColor, overrideSecondaryColor, overrideTheme, }) => {
     const primaryColor = overridePrimaryColor || zonosStore.appearance.colorPrimary;
+    const secondaryColor = overrideSecondaryColor || zonosStore.appearance.colorSecondary;
     const themeBasedColor = primaryColor && isDarkColor(primaryColor) ? 'night' : 'flat';
     // if overrideTheme is provided, use it. Otherwise, use theme based on primary color
     const theme = overrideTheme === 'DARK' ? 'night' : 'flat';
@@ -141,17 +170,19 @@ const getStripeOptions = ({ clientSecret, overrideBorderRaidus, overridePrimaryC
             rules: Object.assign({}, addressRuleStyle({ theme: 'LIGHT' })),
             // get contrast theme color base on primary color
             theme: overrideTheme ? theme : themeBasedColor,
-            variables: Object.assign({}, defaultVariable({
+            variables: Object.assign(Object.assign({}, defaultVariable({
                 borderStyle: overrideBorderRaidus,
                 theme: 'LIGHT',
-            })),
+            })), { 
+                // use the button background color for input glow color
+                colorPrimary: secondaryColor }),
         },
         clientSecret,
         locale: localizationStore.selectedLocale,
     };
 };
 const initStripeElements = async (props) => {
-    var _a;
+    var _a, _b;
     const clientSecret = stripeStore.clientSecret;
     if (!stripeStore.stripe) {
         log('Skip. Stripe is not initialized');
@@ -162,22 +193,30 @@ const initStripeElements = async (props) => {
             clientSecret,
             overrideBorderRaidus: props === null || props === void 0 ? void 0 : props.overrideBorderRaidus,
             overridePrimaryColor: props === null || props === void 0 ? void 0 : props.overridePrimaryColor,
+            overrideSecondaryColor: props === null || props === void 0 ? void 0 : props.overrideSecondaryColor,
             overrideTheme: props === null || props === void 0 ? void 0 : props.overrideTheme,
         });
         // compare with the previous options to see if we need to update
         const isSameOptions = JSON.stringify(stripeOptions) ===
             JSON.stringify(stripeStore.stripeElementsOptions);
-        if (!stripeStore.stripeElements) {
+        if (!stripeStore.stripeElements ||
+            !stripeStore.stripeElementsForBillingAddress) {
             // init stripe elements if it doesn't exist
             stripeStore.stripeElements = (_a = stripeStore.stripe) === null || _a === void 0 ? void 0 : _a.elements(stripeOptions);
             // save stripe elements options for later comparison
             stripeStore.stripeElementsOptions = stripeOptions;
             log('Stripe elements initialized');
+            // init stripe elements for billing address
+            stripeStore.stripeElementsForBillingAddress =
+                (_b = stripeStore.stripe) === null || _b === void 0 ? void 0 : _b.elements(stripeOptions);
+            log('Stripe elements for billing address initialized');
             return;
         }
         if (!isSameOptions) {
             // update elements with new option if it already exists
             stripeStore.stripeElements.update(stripeOptions);
+            // update elements for stripe billing address
+            stripeStore.stripeElementsForBillingAddress.update(stripeOptions);
             // save stripe elements options for later comparison
             stripeStore.stripeElementsOptions = stripeOptions;
         }
@@ -197,7 +236,7 @@ const stripeStoreReset = () => {
  * Purpose is to resend the request if the info used when fetching landed cost is different from the current info
  */
 const isPrefetchInfoOutdated = () => {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e, _f;
     const hasAbortController = stripeStore.fetchingLandedCostAbordController;
     if (!hasAbortController) {
         // if there is no abort controller, this is a new request
@@ -207,26 +246,36 @@ const isPrefetchInfoOutdated = () => {
         JSON.stringify((_b = stripeStore.stripeLinkEventData) === null || _b === void 0 ? void 0 : _b.value);
     const isAddressDataDirty = JSON.stringify((_c = stripeStore.stripeAddressUsedWhenFetchingLC) === null || _c === void 0 ? void 0 : _c.value) !==
         JSON.stringify((_d = stripeStore.stripeAddressEventData) === null || _d === void 0 ? void 0 : _d.value);
-    return isLinkDataDirty || isAddressDataDirty;
+    const isBillingAddressDataDirty = !stripeStore.stripeShippingSameAsBilling &&
+        JSON.stringify((_e = stripeStore.stripeBillingAddressEventData) === null || _e === void 0 ? void 0 : _e.value) !==
+            JSON.stringify((_f = stripeStore.stripeBillingAddressUsedWhenFetchingLC) === null || _f === void 0 ? void 0 : _f.value);
+    return isLinkDataDirty || isAddressDataDirty || isBillingAddressDataDirty;
 };
 const stripeStorePrefetchLandedCost = async () => {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e, _f;
     const stripeAddressReady = !!((_a = stripeStore.stripeAddressEventData) === null || _a === void 0 ? void 0 : _a.complete);
     const stripeLinkReady = !!((_b = stripeStore.stripeLinkEventData) === null || _b === void 0 ? void 0 : _b.complete);
+    const stripeBillingAddressReady = stripeStore.stripeShippingSameAsBilling
+        ? !!((_c = stripeStore.stripeLinkEventData) === null || _c === void 0 ? void 0 : _c.complete)
+        : !!((_d = stripeStore.stripeBillingAddressEventData) === null || _d === void 0 ? void 0 : _d.complete);
     const shouldRefetch = isPrefetchInfoOutdated();
     if (shouldRefetch) {
         // if the info used when fetching landed cost is different from the current info, abort the previous request
-        (_c = stripeStore.fetchingLandedCostAbordController) === null || _c === void 0 ? void 0 : _c.abort();
+        (_e = stripeStore.fetchingLandedCostAbordController) === null || _e === void 0 ? void 0 : _e.abort();
         stripeStore.fetchingLandedCostAbordController = null;
     }
     // only fetch if we are not fetching or we need to refetch
     if (stripeAddressReady &&
         stripeLinkReady &&
+        stripeBillingAddressReady &&
         (shouldRefetch || !stripeStore.isFetchingLandedCost)) {
         stripeStore.isFetchingLandedCost = true;
         if (stripeStore.stripeAddressEventData) {
             stripeStore.stripeAddressUsedWhenFetchingLC = Object.assign({}, stripeStore.stripeAddressEventData);
         }
+        if (stripeStore.stripeBillingAddressEventData) {
+            stripeStore.stripeBillingAddressUsedWhenFetchingLC = Object.assign({}, stripeStore.stripeBillingAddressEventData);
+        }
         if (stripeStore.stripeLinkEventData) {
             stripeStore.stripeLinkUsedWhenFetchingLC = Object.assign({}, stripeStore.stripeLinkEventData);
         }
@@ -242,7 +291,7 @@ const stripeStorePrefetchLandedCost = async () => {
             cartStore.shippingData =
                 (shipmentRatingCalculateWorkflow === null || shipmentRatingCalculateWorkflow === void 0 ? void 0 : shipmentRatingCalculateWorkflow.filter(Boolean)) || null;
             // apply new subtotal and total, this is mainly to show items in the presentment currency
-            const firstLandedCostData = (_d = cartStore.landedCostData) === null || _d === void 0 ? void 0 : _d.find(Boolean);
+            const firstLandedCostData = (_f = cartStore.landedCostData) === null || _f === void 0 ? void 0 : _f.find(Boolean);
             const subtotals = !!firstLandedCostData
                 ? firstLandedCostData.subtotals
                 : null;
@@ -484,6 +533,8 @@ const cartStoreReset = () => {
     reset();
 };
 const cartStoreUpdateToErrorState = ({ messages, title, }) => {
+    cartStoreReset();
+    stripeStoreReset();
     cartStore.step = 'error';
     cartStore.error = {
         messages,
@@ -628,4 +679,4 @@ const cartStorePreviousStep = () => {
     }
 };
 
-export { cartStoreApplySubtotals as a, cartStoreGetShippingTransitInfo as b, cartStore as c, cartStoreNextStep as d, cartStorePreviousStep as e, cartStoreReCalculateTotal as f, cartStoreReset as g, cartStoreUpdateItems as h, cartStoreUpdateSelectedShippingOption as i, cartStoreUpdateToErrorState as j, initStripeElements as k, stripeStoreInitCheckoutSession as l, stripeStorePrefetchLandedCost as m, stripeStoreConfirmPayment as n, stripeStoreReset as o, stripeStoreRetrievePayment as p, stripeStore as s };
+export { cartStoreUpdateItems as a, cartStoreReset as b, cartStore as c, stripeStoreInitCheckoutSession as d, cartStoreUpdateToErrorState as e, stripeStorePrefetchLandedCost as f, cartStoreNextStep as g, stripeStoreConfirmPayment as h, initStripeElements as i, stripeStoreReset as j, cartStorePreviousStep as k, stripeStoreRetrievePayment as l, cartStoreUpdateSelectedShippingOption as m, cartStoreGetShippingTransitInfo as n, stripeStore as s };

package/dist/esm/getBorderRadius-e9736f7e.js

@@ -0,0 +1,20 @@
+import { z as zonosStore } from './zonosStore-e6c7be3a.js';
+
+/**
+ * Get the border radius for the elements based on the style
+ * @param overrideBorderStyle
+ * @returns
+ */
+const getBorderRadius = (overrideBorderStyle, 
+/**
+ * This is the custom round radius for component that 10px is too much for them
+ */
+customRoundRadius = '10px') => {
+    if (overrideBorderStyle) {
+        // If the override is set, use that, otherwise use the default radius style
+        return overrideBorderStyle === 'SHARP' ? '0px' : customRoundRadius;
+    }
+    return zonosStore.appearance.style === 'SHARP' ? '0px' : customRoundRadius;
+};
+
+export { getBorderRadius as g };

package/dist/esm/index.js

@@ -1,6 +1 @@
-export { c as cartStore, a as cartStoreApplySubtotals, b as cartStoreGetShippingTransitInfo, d as cartStoreNextStep, e as cartStorePreviousStep, f as cartStoreReCalculateTotal, g as cartStoreReset, h as cartStoreUpdateItems, i as cartStoreUpdateSelectedShippingOption, j as cartStoreUpdateToErrorState } from './cart-ba9b0d4c.js';
-import './zonosStore-e59617f8.js';
-import './index-81a199ef.js';
-import './localization-5d83fde2.js';
-import './isDarkColor-8696cb70.js';
-import './getBorderRadius-9e4cb3b1.js';
+

package/dist/esm/isCheckoutMobile-8846dccb.js

@@ -0,0 +1,6 @@
+const checkoutBreakpoint = 890;
+const isCheckoutMobile = (isMobile) => {
+    return isMobile || window.innerWidth < checkoutBreakpoint;
+};
+
+export { isCheckoutMobile as i };