npm - @zonos/elements - Versions diffs - 1.3.15-alpha.0 → 1.3.15-alpha.2 - Mend

@zonos/elements 1.3.15-alpha.0 → 1.3.15-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (227) hide show

package/dist/components/zonos-card2.js CHANGED Viewed

@@ -19,12 +19,12 @@ const ZonosCard = /*@__PURE__*/ proxyCustomElement(class ZonosCard extends HTMLE
         this.spacing = '24px';
     }
     render() {
-        return (h(Host, { key: '0d8b5af14b922c5bb4664a657da1f5f40dbb80c9', style: {
+        return (h(Host, { key: '49d97d816bec7113ef6654cdf6f54598a17ebc00', style: {
                 '--font-family': zonosStoreFontFamily(),
-            } }, h("div", { key: '4636de2659dac17eddf05aa9ce0e3b1b3091de65', class: classes(['styled-card']), style: { padding: this.spacing } }, this.label && (h("header", { key: '591276139b808995cb26b54921bdbb1d55995fbb', class: "card-header", style: { padding: this.spacing } }, h("zonos-text", { key: '017ca4195a3d2b9efdc337966203165a1f0f074d', type: "subheader" }, this.label), h("h-stack", { key: 'dc3a2c4ad7cb2a053819727fc5bff90d70438a25', spacing: 8 }, this.actions))), h("slot", { key: '0f19e23f2744b2ccbfc5ca7d1aefebf7326ab649' }), (this.footerActions || this.footerContent) && (h("footer", { key: 'fd0adb2b5146f0542c12b2628f011417911c54ec', class: "card-footer", style: {
+            } }, h("div", { key: '6c4e326aa182ab597b099ddaf228b8b83efc471f', class: classes(['styled-card']), style: { padding: this.spacing } }, this.label && (h("header", { key: 'eb96bb3be8a7f78cec51f0288ed7d78b4f598659', class: "card-header", style: { padding: this.spacing } }, h("zonos-text", { key: '11b6afcf37ec978d154990ab0a6b558d3b203126', type: "subheader" }, this.label), h("h-stack", { key: 'ae03b7569dc0f0e28fccd6c225305db778c6a21e', spacing: 8 }, this.actions))), h("slot", { key: 'b6224bc4d019e302b36a81c6c3a81e2bca4504b1' }), (this.footerActions || this.footerContent) && (h("footer", { key: 'f629f3d4914a92f400e7ccfd347e211bbf11035b', class: "card-footer", style: {
                 height: this.footerHeight ? `${this.footerHeight}px` : 'auto',
                 padding: this.spacing,
-            } }, h("div", { key: '82bc7d63eec3c3d716128740e86879a11befa0aa' }, this.footerContent), h("h-stack", { key: '66261eaffa40882c5bd2255649325a16a5f65f7e', spacing: 8 }, this.footerActions))))));
+            } }, h("div", { key: '696d8588e5de862f111c09b801d26f2625e4017f' }, this.footerContent), h("h-stack", { key: '3b2df392b850b27fcdc6e745a2d5093124562367', spacing: 8 }, this.footerActions))))));
     }
     static get style() { return ZonosCardStyle0; }
 }, [1, "zonos-card", {

package/dist/components/zonos-checkbox2.js CHANGED Viewed

@@ -46,14 +46,14 @@ const ZonosCheckbox = /*@__PURE__*/ proxyCustomElement(class ZonosCheckbox exten
                     ? 'var(--amino-gray-800)'
                     : 'var(--amino-gray-0)';
         const borderStyle = getBorderRadius(this.borderStyle, '4px');
-        return (h(Host, { key: '47b3b90b44f846e49de755f2c131e79da3f34c0f', class: classes(['zonos--elements zonos--checkbox']), style: {
+        return (h(Host, { key: '1383262a5cca00ede5154fbdf37bbabb8cbcd501', class: classes(['zonos--elements zonos--checkbox']), style: {
                 '--background-color': backgroundColor,
                 '--border-radius': borderStyle,
                 '--font-family': zonosStoreFontFamily(),
                 '--size': `${this.size}px`,
-            } }, h("label", { key: '6c1aac697aee17eb684d8416ae65092e3095fada', class: classes([this.isDisabled && 'disabled']) }, h("input", { key: 'f75b6bff9ea136596af3489721096d862ea622c3', checked: this.isChecked, disabled: this.isDisabled, hidden: true, onChange: e => {
+            } }, h("label", { key: 'aa01d0b1eebb53587f8d2d344e3b1d01a6a7a683', class: classes([this.isDisabled && 'disabled']) }, h("input", { key: '166eef6010570137110f8548c9eb76f32e5616e9', checked: this.isChecked, disabled: this.isDisabled, hidden: true, onChange: e => {
                 this.checkboxSelected.emit(e.target.checked);
-            }, type: "checkbox" }), h("span", { key: '2a2dcd8e798fdd54daf43dedcb42dac3088a6dfc', class: "checkmark-container" }, h("svg", { key: 'e74713df9adc970d0a5b8d6374eb63e69c64ff1a', class: "checkmark", color: checkmarkColor, fill: "none", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '3ae1a1a8f74a607ad5d4e4f940b45ac0b242426e', "clip-rule": "evenodd", d: "M17.456 7.404a.75.75 0 0 1 .14 1.052l-6.5 8.5a.75.75 0 0 1-1.126.074l-4-4a.75.75 0 0 1 1.06-1.06l3.395 3.394 5.98-7.82a.75.75 0 0 1 1.05-.14Z", fill: "currentColor", "fill-rule": "evenodd" }))), this.label && (h("zonos-text", { key: '25ff0a74e7ec6409e41d3f2998648f0c28a28ae0', size: this.fontSize }, this.label)))));
+            }, type: "checkbox" }), h("span", { key: 'd98289266cd4e78dd1e5c9b89019d0dd4927e4d0', class: "checkmark-container" }, h("svg", { key: 'e179fe12a77e0c7f1f48bc943ff472d0a75e05d5', class: "checkmark", color: checkmarkColor, fill: "none", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '147acf112b6d28fa30af8e8c7fe8d7f998a507ab', "clip-rule": "evenodd", d: "M17.456 7.404a.75.75 0 0 1 .14 1.052l-6.5 8.5a.75.75 0 0 1-1.126.074l-4-4a.75.75 0 0 1 1.06-1.06l3.395 3.394 5.98-7.82a.75.75 0 0 1 1.05-.14Z", fill: "currentColor", "fill-rule": "evenodd" }))), this.label && (h("zonos-text", { key: 'b83bb5bb1881580be3d0ab3ed83157a0c0ce3f8e', size: this.fontSize }, this.label)))));
     }
     static get style() { return ZonosCheckboxStyle0; }
 }, [1, "zonos-checkbox", {

package/dist/components/zonos-checkout-footer2.js CHANGED Viewed

@@ -23,7 +23,7 @@ const ZonosIcon = `<svg width="105" height="29" viewBox="0 0 105 29" fill="none"
 </svg>
 `;
-const zonosCheckoutFooterCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{position:absolute;bottom:-50px;left:0;right:0;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;z-index:2}:host .zonos--checkout-footer{width:calc(90vw - 22px);gap:var(--amino-space-16);display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:var(--amino-space-12);-ms-flex-align:center;align-items:center}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:var(--amino-space-8)}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper a{line-height:0}:host .zonos--checkout-footer zonos-button button.outline{outline:1px solid var(--amino-gray-800)}:host .zonos--checkout-footer .zonos--checkout-locale-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:var(--amino-space-8);position:relative}@media (max-width: 400px){:host .zonos--checkout-footer .zonos--checkout-locale-wrapper{gap:var(--amino-space-4)}}:host .zonos--checkout-footer .zonos--checkout-footer-dialog{position:absolute;bottom:36px;left:var(--language-dialog-left);background:var(--amino-surface-color);-webkit-box-shadow:var(--amino-v3-shadow-xl);box-shadow:var(--amino-v3-shadow-xl);border-radius:var(--amino-radius-12);width:360px;max-width:100vw;max-height:500px;z-index:10005;overflow:auto;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:bottom left;transform-origin:bottom left;opacity:0;-webkit-transition:opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;transition:opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;transition:transform 0.3s ease-out, opacity 0.3s ease-out;transition:transform 0.3s ease-out, opacity 0.3s ease-out, -webkit-transform 0.3s ease-out}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar{width:10px}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-track{background:var(--amino-gray-50)}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-thumb:hover{background:#d6d6d6}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-track{border-top-right-radius:var(--amino-radius-12);border-bottom-right-radius:var(--amino-radius-12)}:host .zonos--checkout-footer .zonos--checkout-footer-dialog.zonos--checkout-footer-dialog-open{opacity:1;-webkit-transform:scale(1);transform:scale(1)}:host(.mobile){-ms-flex-direction:column;flex-direction:column;gap:var(--amino-space-32);background:var(--amino-gray-0);position:relative;padding-top:var(--amino-space-24);bottom:0}:host(.mobile) .zonos--checkout-footer{-ms-flex-direction:column;flex-direction:column}:host(.mobile) .zonos--checkout-locale-wrapper{-ms-flex-direction:column;flex-direction:column}:host(.mobile) .zonos--checkout-footer-dialog{position:fixed;left:0;right:0;bottom:0;-webkit-transform-origin:bottom center;transform-origin:bottom center;width:100vw}";
+const zonosCheckoutFooterCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{position:absolute;bottom:-50px;left:0;right:0;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;z-index:2}:host .zonos--checkout-footer{width:calc(90vw - 22px);gap:var(--amino-space-16);display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:var(--amino-space-12);-ms-flex-align:center;align-items:center}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:var(--amino-space-24)}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper .zonos--checkout-footer-logo{display:-ms-inline-flexbox;display:inline-flex;gap:var(--amino-space-8);-ms-flex-align:center;align-items:center}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper .zonos--checkout-footer-logo a{line-height:0}:host .zonos--checkout-footer .zonos--checkout-footer-icon-wrapper a{text-decoration:none}:host .zonos--checkout-footer zonos-button button.outline{outline:1px solid var(--amino-gray-800)}:host .zonos--checkout-footer .zonos--checkout-locale-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:var(--amino-space-8);position:relative}@media (max-width: 400px){:host .zonos--checkout-footer .zonos--checkout-locale-wrapper{gap:var(--amino-space-4)}}:host .zonos--checkout-footer .zonos--checkout-footer-dialog{position:absolute;bottom:36px;left:var(--language-dialog-left);background:var(--amino-surface-color);-webkit-box-shadow:var(--amino-v3-shadow-xl);box-shadow:var(--amino-v3-shadow-xl);border-radius:var(--amino-radius-12);width:360px;max-width:100vw;max-height:500px;z-index:10005;overflow:auto;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:bottom left;transform-origin:bottom left;opacity:0;-webkit-transition:opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;transition:opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;transition:transform 0.3s ease-out, opacity 0.3s ease-out;transition:transform 0.3s ease-out, opacity 0.3s ease-out, -webkit-transform 0.3s ease-out}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar{width:10px}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-track{background:var(--amino-gray-50)}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-thumb:hover{background:#d6d6d6}:host .zonos--checkout-footer .zonos--checkout-footer-dialog::-webkit-scrollbar-track{border-top-right-radius:var(--amino-radius-12);border-bottom-right-radius:var(--amino-radius-12)}:host .zonos--checkout-footer .zonos--checkout-footer-dialog.zonos--checkout-footer-dialog-open{opacity:1;-webkit-transform:scale(1);transform:scale(1)}:host(.mobile){-ms-flex-direction:column;flex-direction:column;gap:var(--amino-space-32);background:var(--amino-gray-0);position:relative;padding-top:var(--amino-space-24);bottom:0}:host(.mobile) .zonos--checkout-footer{-ms-flex-direction:column;flex-direction:column;gap:var(--amino-space-4)}:host(.mobile) .zonos--checkout-locale-wrapper{-ms-flex-direction:column;flex-direction:column}:host(.mobile) .zonos--checkout-footer-icon-wrapper{-ms-flex-direction:column;flex-direction:column}:host(.mobile) .zonos--checkout-footer-dialog{position:fixed;left:0;right:0;bottom:0;-webkit-transform-origin:bottom center;transform-origin:bottom center;width:100vw}";
 const ZonosCheckoutFooterStyle0 = zonosCheckoutFooterCss;
 const ZonosCheckoutFooter = /*@__PURE__*/ proxyCustomElement(class ZonosCheckoutFooter extends HTMLElement {
@@ -58,7 +58,7 @@ const ZonosCheckoutFooter = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout
         return (h(Host, { key: 'fae1e5cb1250e834ecf3b09f11785ddea61be3b2', class: classes(['zonos--elements', this.isMobile && 'mobile']) }, h("div", { key: 'f3d48fcc675458dd38ca48e21f24a003b5ff9b56', class: "zonos--checkout-footer" }, h("div", { key: '97daec871630cf2bb33956b668abee2e715eceb5', class: "zonos--checkout-locale-wrapper" }, h("zonos-button", { key: 'cd6e12e8d1320e3e6542eef16f15ab27921748c3', buttonColor: colorDesktop, class: "zonos--checkout-footer-language-button", icon: h("zonos-icon", { "aria-label": "Language select", content: Globe, iconColor: colorDesktop }), onClick: () => this.toggleLanguageDialog(), variant: "subtle" }, languageLabel), h("div", { key: 'bdc6d9311d2d039e87c261ead45474b7bf1fe992', class: classes([
                 'zonos--checkout-footer-dialog',
                 this.showLanguageDialog && 'zonos--checkout-footer-dialog-open',
-            ]) }, h("zonos-language-select", { key: '7318bb4137e160e9ed05a423fb80f1806c4f0104', handleOnClose: () => this.toggleLanguageDialog() }))), h("div", { key: '55c76c6cf6777407532c00cf167d59e3cefc5eab', class: "zonos--checkout-footer-icon-wrapper" }, h("zonos-text", { key: '41a7fae5a1a08d22b91341ccfcc0df9daeeb8f82', textColor: colorDesktop, type: "caption" }, "Powered by"), h("a", { key: '394e19392718d2a40a351692fa358f8f86366b46', href: "https://zonos.com", target: "_blank", title: "Zonos website" }, h("zonos-icon", { key: '4d8cadbb7c26e8f7888caad2b158d521ab504590', autoHeight: true, content: ZonosIcon, iconColor: colorDesktop, size: 108 }))))));
+            ]) }, h("zonos-language-select", { key: '7318bb4137e160e9ed05a423fb80f1806c4f0104', handleOnClose: () => this.toggleLanguageDialog() }))), h("div", { key: '55c76c6cf6777407532c00cf167d59e3cefc5eab', class: "zonos--checkout-footer-icon-wrapper" }, h("a", { key: 'e2cf10499ed764fb2e7086761ece106580cd6440', href: "https://zonos.com/docs/legal/zonos-privacy-policy", target: "_blank" }, h("zonos-text", { key: '0fe6c810a6d7f84a781655cefc47ec6cbb5131c9', textColor: colorDesktop }, "Privacy policy")), h("div", { key: '50401876a45161e80f593971e602e4c449e78dbe', class: "zonos--checkout-footer-logo" }, h("zonos-text", { key: '0f69d9d9955165de13a49ff00a7044090b141800', textColor: colorDesktop }, "Powered by"), h("a", { key: '680e6fe4d0a783e2ebc55a51ffb55846ad997249', href: "https://zonos.com", target: "_blank", title: "Zonos website" }, h("zonos-icon", { key: '22aee1eb21306141e620bcc1b0dbf035bd710fba', autoHeight: true, content: ZonosIcon, iconColor: colorDesktop, size: 108 })))))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/zonos-checkout-payment2.js CHANGED Viewed

@@ -8,7 +8,7 @@ import { d as defineCustomElement$3 } from './zonos-payment2.js';
 import { d as defineCustomElement$2 } from './zonos-spinner2.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
-const zonosCheckoutPaymentCss = ".sc-zonos-checkout-payment-h{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-checkout-payment-h *.sc-zonos-checkout-payment{font-family:var(--font-family, Inter), Inter}.sc-zonos-checkout-payment-h img.sc-zonos-checkout-payment{max-width:100%}.sc-zonos-checkout-payment-h dl.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h dd.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h1.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h2.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h3.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h4.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h5.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h6.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h hr.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h figure.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h p.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h pre.sc-zonos-checkout-payment{margin:0}.sc-zonos-checkout-payment-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-checkout-payment-h{overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.sc-zonos-checkout-payment-h .zonos--title.sc-zonos-checkout-payment{margin-bottom:var(--amino-space-24)}.sc-zonos-checkout-payment-h .zonos--group.sc-zonos-checkout-payment{margin-bottom:var(--amino-space-20);overflow:auto;padding:5px}.sc-zonos-checkout-payment-h .zonos--group.sc-zonos-checkout-payment::-webkit-scrollbar{width:10px}.sc-zonos-checkout-payment-h .zonos--group.sc-zonos-checkout-payment::-webkit-scrollbar-track{background:var(--amino-gray-50)}.sc-zonos-checkout-payment-h .zonos--group.sc-zonos-checkout-payment::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}.sc-zonos-checkout-payment-h .zonos--group.sc-zonos-checkout-payment::-webkit-scrollbar-thumb:hover{background:#d6d6d6}.sc-zonos-checkout-payment-h .zonos--payment-error-banner.sc-zonos-checkout-payment{margin-bottom:var(--amino-space-8)}.sc-zonos-checkout-payment-h zonos-button.sc-zonos-checkout-payment{-webkit-box-shadow:0 0 1px 0 var(--amino-gray-600);box-shadow:0 0 1px 0 var(--amino-gray-600)}.sc-zonos-checkout-payment-h .zonos--group-btn.sc-zonos-checkout-payment{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-checkout-payment-h .zonos--group-btn.sc-zonos-checkout-payment zonos-button.sc-zonos-checkout-payment{width:100%}";
+const zonosCheckoutPaymentCss = ".sc-zonos-checkout-payment-h{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-checkout-payment-h *.sc-zonos-checkout-payment{font-family:var(--font-family, Inter), Inter}.sc-zonos-checkout-payment-h img.sc-zonos-checkout-payment{max-width:100%}.sc-zonos-checkout-payment-h dl.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h dd.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h1.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h2.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h3.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h4.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h5.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h h6.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h hr.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h figure.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h p.sc-zonos-checkout-payment,.sc-zonos-checkout-payment-h pre.sc-zonos-checkout-payment{margin:0}.sc-zonos-checkout-payment-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-checkout-payment-h{overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.sc-zonos-checkout-payment-h .zonos--title.sc-zonos-checkout-payment{margin-bottom:var(--amino-space-24)}.sc-zonos-checkout-payment-h .zonos--group.sc-zonos-checkout-payment{margin-bottom:var(--amino-space-20);overflow:auto;padding:5px}.sc-zonos-checkout-payment-h .zonos--group.sc-zonos-checkout-payment::-webkit-scrollbar{width:10px}.sc-zonos-checkout-payment-h .zonos--group.sc-zonos-checkout-payment::-webkit-scrollbar-track{background:var(--amino-gray-50)}.sc-zonos-checkout-payment-h .zonos--group.sc-zonos-checkout-payment::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}.sc-zonos-checkout-payment-h .zonos--group.sc-zonos-checkout-payment::-webkit-scrollbar-thumb:hover{background:#d6d6d6}.sc-zonos-checkout-payment-h .zonos--payment-error-banner.sc-zonos-checkout-payment{margin-bottom:var(--amino-space-8)}.sc-zonos-checkout-payment-h .zonos--error-banner.sc-zonos-checkout-payment{margin-bottom:var(--amino-space-16)}.sc-zonos-checkout-payment-h zonos-button.sc-zonos-checkout-payment{-webkit-box-shadow:0 0 1px 0 var(--amino-gray-600);box-shadow:0 0 1px 0 var(--amino-gray-600)}.sc-zonos-checkout-payment-h .zonos--group-btn.sc-zonos-checkout-payment{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-checkout-payment-h .zonos--group-btn.sc-zonos-checkout-payment zonos-button.sc-zonos-checkout-payment{width:100%}";
 const ZonosCheckoutPaymentStyle0 = zonosCheckoutPaymentCss;
 const ZonosCheckoutPayment = /*@__PURE__*/ proxyCustomElement(class ZonosCheckoutPayment extends HTMLElement {
@@ -16,49 +16,50 @@ const ZonosCheckoutPayment = /*@__PURE__*/ proxyCustomElement(class ZonosCheckou
         super();
         this.__registerHost();
         this.continueClicked = createEvent(this, "continueClicked", 7);
+        this.handleValidate = () => {
+            var _a;
+            return !!((_a = stripeStore.stripePaymentEventData) === null || _a === void 0 ? void 0 : _a.complete);
+        };
         /**
          * handler for continue button click
          */
         this.continueClickHandler = () => {
+            if (!this.handleValidate()) {
+                this.showErrorBanner = true;
+                return;
+            }
             this.continueClicked.emit();
+            // submit google tag when the form is complete
+            submitGtag('zonos-checkout-payment-info');
         };
         this.paymentError = false;
         this.submitBtnType = undefined;
         this.continueLoading = false;
         this.submitBtnColor = undefined;
-        this.disabled = true;
-    }
-    watchFormComplete() {
-        if (!this.disabled) {
-            // submit google tag when the form is complete
-            submitGtag('zonos-checkout-payment-info');
-        }
+        this.showErrorBanner = false;
     }
     render() {
-        var _a;
         if (!stripeStore.stripeElements) {
             return null;
         }
-        this.disabled = !((_a = stripeStore.stripePaymentEventData) === null || _a === void 0 ? void 0 : _a.complete);
-        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')), this.paymentError && (h("zonos-banner", { class: "zonos--payment-error-banner", intent: "error" }, translate("We couldn't complete your payment. Please verify the payment details and try again."))), h("zonos-payment", null), h("div", { class: "zonos--group-btn" }, h("zonos-button", { backgroundColor: this.submitBtnColor, isDisabled: this.disabled, loading: this.continueLoading, onClick: () => this.continueClickHandler(), size: "lg",
+        // start validate on typing after error banner is shown, and hide it if the form is complete
+        if (this.showErrorBanner) {
+            this.showErrorBanner = !this.handleValidate();
+        }
+        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')), this.showErrorBanner && (h("zonos-banner", { class: "zonos--error-banner", intent: "error" }, translate('Missing required fields. Make sure all fields are completed.'))), this.paymentError && (h("zonos-banner", { class: "zonos--payment-error-banner", intent: "error" }, translate("We couldn't complete your payment. Please verify the payment details and try again."))), h("zonos-payment", null), h("div", { class: "zonos--group-btn" }, h("zonos-button", { backgroundColor: this.submitBtnColor, loading: this.continueLoading, onClick: () => this.continueClickHandler(), size: "lg",
             // use primary type when on mobile mode
             variant: this.submitBtnType }, "Pay", ' ', formatCurrency({
             amount: cartStore.total,
             currency: cartStore.currency,
         }))))));
     }
-    static get watchers() { return {
-        "disabled": ["watchFormComplete"]
-    }; }
     static get style() { return ZonosCheckoutPaymentStyle0; }
 }, [2, "zonos-checkout-payment", {
         "paymentError": [4, "payment-error"],
         "submitBtnType": [1, "submit-btn-type"],
         "continueLoading": [4, "continue-loading"],
         "submitBtnColor": [1, "submit-btn-color"],
-        "disabled": [32]
-    }, undefined, {
-        "disabled": ["watchFormComplete"]
+        "showErrorBanner": [32]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/components/zonos-checkout-progress-tabs2.js CHANGED Viewed

@@ -89,17 +89,17 @@ const ZonosCheckoutProgressTabs = /*@__PURE__*/ proxyCustomElement(class ZonosCh
                 color: labelSelectedColor,
             })
             : labelSelectedColor;
-        return (h(Host, { key: '508d496a46dc5c97d68326e079a344f677f9cfc2', class: "zonos--elements", style: {
+        return (h(Host, { key: '8b1ca1b840103589ca7929771a7b828928ef1a64', class: "zonos--elements", style: {
                 '--color': contrastLabelColor,
                 '--progress-percent': this.getTotalSuccessStep(),
-            } }, h("div", { key: '35892f4230914211d8aecde8bbc99fffebe44f47', class: "zonos--tab-wrapper" }, Object.values(cartStore.tabItems).map((tab, index) => {
+            } }, h("div", { key: 'b1bd07fcc96bd4e900ba945e9f57b27967d3a458', class: "zonos--tab-wrapper" }, Object.values(cartStore.tabItems).map((tab, index) => {
             const isSelected = tab.value === selectedStep;
             return (h("button", { class: classes([
                     'zonos--tab-item',
                     tab.value === selectedStep && 'selected',
                     tab.isDone && 'done',
                 ]), disabled: !this.isTabClickable(tab.value), key: tab.value, onClick: () => (cartStore.step = tab.value) }, h("div", { class: "zonos--tab-index" }, h("zonos-text", { class: "zonos--tab-index-label", textColor: isSelected ? contrastLabelColor : 'gray-1200', type: "label" }, index + 1), h("zonos-icon", { class: "zonos--tab-index-done-icon", content: TabCheckmark, iconColor: isSelected ? contrastLabelColor : 'gray-1200' })), h("zonos-text", { textColor: isSelected ? contrastLabelColor : 'gray-1200', type: "label" }, translate(tab.label))));
-        })), h("div", { key: '475526f811089f65ecfa1d81348f22e77662e565', class: "zonos--tab-progress" }, h("div", { key: 'b45d8170d733043c66e7d6e8f52874f3ccfa0274', class: "zonos--progress-bar-fill" }))));
+        })), h("div", { key: 'f5b8b79050e1ebf23355161202a53854a0d9d08d', class: "zonos--tab-progress" }, h("div", { key: '5e9b4a726dd0cc6601a0097652b06759a7bba1fe', class: "zonos--progress-bar-fill" }))));
     }
     static get assetsDirs() { return ["assets"]; }
     get ele() { return this; }

package/dist/components/zonos-collapse2.js CHANGED Viewed

@@ -48,10 +48,10 @@ const ZonosCollapse = /*@__PURE__*/ proxyCustomElement(class ZonosCollapse exten
             // set overflow to hidden to prevent content from showing when collapsed
             this.el.style.overflow = 'hidden';
         }
-        return (h(Host, { key: 'db574e5124dcd54045af65a6f429af3fddc501fd', class: 'zonos--elements zonos--collapse', style: {
+        return (h(Host, { key: 'ec163c2c73f38e479ba22bb3bea5dbe2f156170b', class: 'zonos--elements zonos--collapse', style: {
                 '--font-family': zonosStoreFontFamily(),
                 height: this.getElementHeight(),
-            } }, h("div", { key: '9f773ededa3fb0b47b2dba74ef701fd8dc3af396' }, h("iframe", { key: '50a8449beb6272a854c34b859be04cdeea10f804', class: "height-change-listener", tabindex: "-1", title: "collapse-height-change-listener" }), h("slot", { key: '5c0bd94dfe7bbb6a8dc20b1bac69e81ae7f99f76' }))));
+            } }, h("div", { key: 'ab8b73ff44968d8e2f3dcf75439b09da36fdfb22' }, h("iframe", { key: '0b6d3518382c4c17a6eacb07c1617e84c7301c39', class: "height-change-listener", tabindex: "-1", title: "collapse-height-change-listener" }), h("slot", { key: '752d9054dadf8905e22cfcca81bb966c2d3ce8d3' }))));
     }
     get el() { return this; }
     static get style() { return ZonosCollapseStyle0; }

package/dist/components/zonos-component.js CHANGED Viewed

@@ -20,7 +20,7 @@ const ZonosComponent$1 = /*@__PURE__*/ proxyCustomElement(class ZonosComponent e
         return format(this.first, this.middle, this.last);
     }
     render() {
-        return h("div", { key: '4d80a174a7fa12f620fc831eb7fe3f5ad8ad575b' }, "Hello, World! I'm ", this.getText());
+        return h("div", { key: '25e0ed1ec26c0b3b3d8539ccb58f914eac9301c8' }, "Hello, World! I'm ", this.getText());
     }
     static get style() { return ZonosComponentStyle0; }
 }, [1, "zonos-component", {

package/dist/components/zonos-controller.js CHANGED Viewed

@@ -265,7 +265,7 @@ const ZonosController$1 = /*@__PURE__*/ proxyCustomElement(class ZonosController
         zonosStore.organizationName = organizationName;
     }
     render() {
-        return h(Host, { key: 'e0869cf08934b9d047adef9875c9a5f50d604bdf', class: "zonos--elements" });
+        return h(Host, { key: 'fb8d58a358b76ed2def980d7cd516266253bbbb4', class: "zonos--elements" });
     }
     static get style() { return ZonosControllerStyle0; }
 }, [1, "zonos-controller", {

package/dist/components/zonos-country-select2.js CHANGED Viewed

@@ -1829,9 +1829,9 @@ const ZonosCountrySelect = /*@__PURE__*/ proxyCustomElement(class ZonosCountrySe
         const filteredCountries = this.inputValue
             ? fuseObject.map(country => country.item)
             : countries.sort((a, b) => a.displayName.localeCompare(b.displayName));
-        return (h(Host, { key: 'ae921c5a4aa83cdde8f42d8993603e824344f11a', class: "zonos--elements", style: {
+        return (h(Host, { key: '4ac4ac37704300786a6a4b3668b1608cf9c2fd96', class: "zonos--elements", style: {
                 '--font-family': zonosStoreFontFamily(),
-            } }, h("div", { key: 'b3bd4c0a0a4aeee8f4de78aadd8cd26b69e060a3', class: "zonos--country-select" }, h("zonos-v-stack", { key: 'aae54d33cc8a3b6befcbb259f92320da230df5be', class: "zonos--country-select-header", spacing: 8 }, h("zonos-select-dialog-header", { key: '8627db51744e70f94ce01a024ac38343d7f2ee00', handleOnClose: () => this.handleOnClose(), label: "Select a country" }, h("input", { key: 'affa5003e513bae802cdf029f3996cc2dd31f7d4', class: "zonos--country-select-input", onInput: this.handleInputChange, placeholder: "Search countries", value: this.inputValue }))), h("div", { key: '8b892a23cb69d44d886b69a7a038e3a98c97eb1b', class: "zonos--country-select-content" }, filteredCountries.map(country => (h("button", { class: "zonos--country-select-country", onClick: () => this.countrySelected(country.code) }, h("zonos-country-flag", { class: "zonos--country-flag", countryCode: country.code }), h("zonos-text", { textColor: "gray-800" }, country.displayName), country.code === localizationStore.selectedCountryCode && (h("zonos-icon", { content: GreenCheckDuotoneIcon, size: 20 })))))))));
+            } }, h("div", { key: 'aecc099069d42c73703f510b7021d1a0b988b810', class: "zonos--country-select" }, h("zonos-v-stack", { key: '358b01905c26ea03eef9c8a1551d1faa5c13b763', class: "zonos--country-select-header", spacing: 8 }, h("zonos-select-dialog-header", { key: 'a22baac4b445d2dee08be2cb9c31714b226d9327', handleOnClose: () => this.handleOnClose(), label: "Select a country" }, h("input", { key: '71515910f8bb3ef512c76a71246272f49506ee63', class: "zonos--country-select-input", onInput: this.handleInputChange, placeholder: "Search countries", value: this.inputValue }))), h("div", { key: '44d417c7859f4263c8286e60a2cc9bfbe7a6698d', class: "zonos--country-select-content" }, filteredCountries.map(country => (h("button", { class: "zonos--country-select-country", onClick: () => this.countrySelected(country.code) }, h("zonos-country-flag", { class: "zonos--country-flag", countryCode: country.code }), h("zonos-text", { textColor: "gray-800" }, country.displayName), country.code === localizationStore.selectedCountryCode && (h("zonos-icon", { content: GreenCheckDuotoneIcon, size: 20 })))))))));
     }
     get ele() { return this; }
     static get style() { return ZonosCountrySelectStyle0; }

package/dist/components/zonos-custom-message2.js CHANGED Viewed

@@ -31,9 +31,9 @@ const ZonosCustomMessage = /*@__PURE__*/ proxyCustomElement(class ZonosCustomMes
     }
     render() {
         const messageWithLinks = formatStringWithLinks(this.message);
-        return (h(Host, { key: 'b917fa2e0b2293b3423ba8910cca667b62c3b7c0', class: "zonos--elements", style: {
+        return (h(Host, { key: '197958ea99ffdb3cfc291144129c20b01fdd8b11', class: "zonos--elements", style: {
                 '--font-family': zonosStoreFontFamily(),
-            } }, this.message && (h("zonos-card", { key: '28d3e6d986ee9a2d56ddb173f1e1e5094d18634a', class: "zonos--custom-message", spacing: "12px" }, h("div", { key: '526de02e727a977f42e5547fc1ba0c91d682e72f', class: "zonos--flex-message" }, h("zonos-icon", { key: '0e2360d11bff3c94c3ba722a0a2b4767f04232fc', "aria-label": "Custom message icon", content: this.icon }), h("zonos-text", { key: 'fa8c7e5042f1d622053ccd86bb52b51304ffc83e', innerHTML: messageWithLinks }))))));
+            } }, this.message && (h("zonos-card", { key: 'c8ac70b6c21f6b412653a859661a07a3a07905c6', class: "zonos--custom-message", spacing: "12px" }, h("div", { key: '2efe05820fd9e5f23d48a9ac0c167d3ec41b34d1', class: "zonos--flex-message" }, h("zonos-icon", { key: '81577b44466ad6ed48b014fd20b441b3be96a70b', "aria-label": "Custom message icon", content: this.icon }), h("zonos-text", { key: '16ba131ca7a8d80c81de6c38f3fbd11d872a8b2a', innerHTML: messageWithLinks }))))));
     }
     static get style() { return ZonosCustomMessageStyle0; }
 }, [1, "zonos-custom-message", {

package/dist/components/zonos-customer-info2.js CHANGED Viewed

@@ -11,7 +11,7 @@ import { d as defineCustomElement$3 } from './zonos-link-authentication2.js';
 import { d as defineCustomElement$2 } from './zonos-spinner2.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
-const zonosCustomerInfoCss = ".sc-zonos-customer-info-h{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-customer-info-h *.sc-zonos-customer-info{font-family:var(--font-family, Inter), Inter}.sc-zonos-customer-info-h img.sc-zonos-customer-info{max-width:100%}.sc-zonos-customer-info-h dl.sc-zonos-customer-info,.sc-zonos-customer-info-h dd.sc-zonos-customer-info,.sc-zonos-customer-info-h h1.sc-zonos-customer-info,.sc-zonos-customer-info-h h2.sc-zonos-customer-info,.sc-zonos-customer-info-h h3.sc-zonos-customer-info,.sc-zonos-customer-info-h h4.sc-zonos-customer-info,.sc-zonos-customer-info-h h5.sc-zonos-customer-info,.sc-zonos-customer-info-h h6.sc-zonos-customer-info,.sc-zonos-customer-info-h hr.sc-zonos-customer-info,.sc-zonos-customer-info-h figure.sc-zonos-customer-info,.sc-zonos-customer-info-h p.sc-zonos-customer-info,.sc-zonos-customer-info-h pre.sc-zonos-customer-info{margin:0}.sc-zonos-customer-info-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-customer-info-h{overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.sc-zonos-customer-info-h .zonos--title.sc-zonos-customer-info{margin-bottom:var(--amino-space-20)}.sc-zonos-customer-info-h .zonos--link-authentication.sc-zonos-customer-info{margin-bottom:var(--amino-space-32)}.sc-zonos-customer-info-h .zonos--address.sc-zonos-customer-info{margin-bottom:var(--amino-space-16)}.sc-zonos-customer-info-h .zonos--checkbox.sc-zonos-customer-info{margin-bottom:var(--amino-space-16)}.sc-zonos-customer-info-h .zonos--checkbox.sc-zonos-customer-info+.zonos--address.sc-zonos-customer-info{margin-bottom:0}.sc-zonos-customer-info-h zonos-button.sc-zonos-customer-info{-webkit-box-shadow:0 0 1px 0 var(--amino-gray-600);box-shadow:0 0 1px 0 var(--amino-gray-600)}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info{margin-bottom:var(--amino-space-20);overflow:auto;padding:5px}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar{width:10px}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-track{background:var(--amino-gray-50)}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-thumb:hover{background:#d6d6d6}.sc-zonos-customer-info-h .zonos--group-btn.sc-zonos-customer-info{position:-webkit-sticky;position:sticky;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;bottom:-5px;padding-top:var(--amino-space-8);margin-top:var(--amino-space-12);background:var(--primary-color, var(--amino-gray-0))}.sc-zonos-customer-info-h .zonos--group-btn.sc-zonos-customer-info zonos-button.sc-zonos-customer-info{width:100%}";
+const zonosCustomerInfoCss = ".sc-zonos-customer-info-h{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-customer-info-h *.sc-zonos-customer-info{font-family:var(--font-family, Inter), Inter}.sc-zonos-customer-info-h img.sc-zonos-customer-info{max-width:100%}.sc-zonos-customer-info-h dl.sc-zonos-customer-info,.sc-zonos-customer-info-h dd.sc-zonos-customer-info,.sc-zonos-customer-info-h h1.sc-zonos-customer-info,.sc-zonos-customer-info-h h2.sc-zonos-customer-info,.sc-zonos-customer-info-h h3.sc-zonos-customer-info,.sc-zonos-customer-info-h h4.sc-zonos-customer-info,.sc-zonos-customer-info-h h5.sc-zonos-customer-info,.sc-zonos-customer-info-h h6.sc-zonos-customer-info,.sc-zonos-customer-info-h hr.sc-zonos-customer-info,.sc-zonos-customer-info-h figure.sc-zonos-customer-info,.sc-zonos-customer-info-h p.sc-zonos-customer-info,.sc-zonos-customer-info-h pre.sc-zonos-customer-info{margin:0}.sc-zonos-customer-info-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-customer-info-h{overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.sc-zonos-customer-info-h .zonos--title.sc-zonos-customer-info{margin-bottom:var(--amino-space-20)}.sc-zonos-customer-info-h .zonos--link-authentication.sc-zonos-customer-info{margin-bottom:var(--amino-space-32)}.sc-zonos-customer-info-h .zonos--address.sc-zonos-customer-info{margin-bottom:var(--amino-space-16)}.sc-zonos-customer-info-h .zonos--checkbox.sc-zonos-customer-info{margin-bottom:var(--amino-space-16)}.sc-zonos-customer-info-h .zonos--checkbox.sc-zonos-customer-info+.zonos--address.sc-zonos-customer-info{margin-bottom:0}.sc-zonos-customer-info-h zonos-button.sc-zonos-customer-info{-webkit-box-shadow:0 0 1px 0 var(--amino-gray-600);box-shadow:0 0 1px 0 var(--amino-gray-600)}.sc-zonos-customer-info-h .zonos--error-banner.sc-zonos-customer-info{margin-bottom:var(--amino-space-16)}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info{margin-bottom:var(--amino-space-20);overflow:auto;padding:5px}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar{width:10px}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-track{background:var(--amino-gray-50)}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-thumb:hover{background:#d6d6d6}.sc-zonos-customer-info-h .zonos--group-btn.sc-zonos-customer-info{position:-webkit-sticky;position:sticky;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;bottom:-5px;padding-top:var(--amino-space-8);margin-top:var(--amino-space-12);background:var(--primary-color, var(--amino-gray-0))}.sc-zonos-customer-info-h .zonos--group-btn.sc-zonos-customer-info zonos-button.sc-zonos-customer-info{width:100%}";
 const ZonosCustomerInfoStyle0 = zonosCustomerInfoCss;
 const ZonosCustomerInfo = /*@__PURE__*/ proxyCustomElement(class ZonosCustomerInfo extends HTMLElement {
@@ -34,60 +34,73 @@ const ZonosCustomerInfo = /*@__PURE__*/ proxyCustomElement(class ZonosCustomerIn
                 }
                 return;
             }
+            if (!this.handleValidate()) {
+                // scroll to the top zonos-banner
+                setTimeout(() => {
+                    var _a;
+                    (_a = this.el
+                        .querySelector('zonos-banner.zonos--error-banner')) === null || _a === void 0 ? void 0 : _a.scrollIntoView({
+                        behavior: 'smooth',
+                        block: 'center',
+                    });
+                }, 50);
+                this.showErrorBanner = true;
+                return;
+            }
+            this.showErrorBanner = false;
             this.continueClicked.emit();
+            // submit google tag when the form is complete
+            submitGtag('zonos-checkout-customer-info');
+            void trackConversionEvent('checkout_customerInfoCompleted');
+        };
+        this.handleValidate = () => {
+            const stripeShippingAddressEventData = stripeStore.stripeAddressEventData;
+            const stripeBillingAddressEventData = stripeStore.stripeBillingAddressEventData;
+            const stripeLinkEventData = stripeStore.stripeLinkEventData;
+            // if the shipping is different from billing, we need to make sure the billing address is valid and disable the button if it's not
+            const isValidBilling = stripeStore.stripeShippingSameAsBilling
+                ? !!(stripeShippingAddressEventData === null || stripeShippingAddressEventData === void 0 ? void 0 : stripeShippingAddressEventData.complete)
+                : !!(stripeBillingAddressEventData === null || stripeBillingAddressEventData === void 0 ? void 0 : stripeBillingAddressEventData.complete);
+            const isValidShipping = !!(stripeShippingAddressEventData === null || stripeShippingAddressEventData === void 0 ? void 0 : stripeShippingAddressEventData.complete);
+            const isValidLink = !!(stripeLinkEventData === null || stripeLinkEventData === void 0 ? void 0 : stripeLinkEventData.complete);
+            if (!isValidBilling || !isValidShipping || !isValidLink) {
+                return false;
+            }
+            return true;
         };
         this.continueLoading = false;
         this.submitBtnType = undefined;
         this.submitBtnColor = undefined;
         this.defaultAddress = null;
-        this.disabled = true;
+        this.showErrorBanner = false;
         this.hasInvalidShippingCharacters = false;
         this.hasInvalidBillingCharacters = false;
     }
-    watchFormComplete() {
-        if (!this.disabled) {
-            // submit google tag when the form is complete
-            submitGtag('zonos-checkout-customer-info');
-            void trackConversionEvent('checkout_customerInfoCompleted');
-        }
-    }
     render() {
         if (!stripeStore.stripeElements) {
             return null;
         }
-        const stripeShippingAddressEventData = stripeStore.stripeAddressEventData;
-        const stripeBillingAddressEventData = stripeStore.stripeBillingAddressEventData;
-        const stripeLinkEventData = stripeStore.stripeLinkEventData;
-        // if the shipping is different from billing, we need to make sure the billing address is valid and disable the button if it's not
-        const isValidBilling = stripeStore.stripeShippingSameAsBilling
-            ? !!(stripeShippingAddressEventData === null || stripeShippingAddressEventData === void 0 ? void 0 : stripeShippingAddressEventData.complete)
-            : !!(stripeBillingAddressEventData === null || stripeBillingAddressEventData === void 0 ? void 0 : stripeBillingAddressEventData.complete);
-        const isValidShipping = !!(stripeShippingAddressEventData === null || stripeShippingAddressEventData === void 0 ? void 0 : stripeShippingAddressEventData.complete);
-        const isValidLink = !!(stripeLinkEventData === null || stripeLinkEventData === void 0 ? void 0 : stripeLinkEventData.complete);
-        // make sure data is valid
-        this.disabled = !isValidBilling || !isValidShipping || !isValidLink;
         const showBilling = !stripeStore.stripeShippingSameAsBilling;
-        return (h(Host, { class: "zonos--customer-info zonos--elements" }, h("div", { class: "zonos--group" }, h("zonos-text", { class: "zonos--title", type: "semiBoldSubheader" }, translate('Customer information')), h("zonos-link-authentication", { titleText: translate('Contact') }), h("zonos-address", { defaultAddress: this.defaultAddress, onInvalidCharacters: e => (this.hasInvalidShippingCharacters = e.detail), titleText: translate('Address'), type: "shipping" }), h("zonos-checkbox", { isChecked: stripeStore.stripeShippingSameAsBilling, label: translate('Shipping address same as billing'), onCheckboxSelected: e => {
+        // start validate on typing after error banner is shown, and hide it if the form is complete
+        if (this.showErrorBanner) {
+            this.showErrorBanner = !this.handleValidate();
+        }
+        return (h(Host, { class: "zonos--customer-info zonos--elements" }, h("div", { class: "zonos--group" }, h("zonos-text", { class: "zonos--title", type: "semiBoldSubheader" }, translate('Customer information')), this.showErrorBanner && (h("zonos-banner", { class: "zonos--error-banner", intent: "error" }, translate('Missing required fields. Make sure all fields are completed.'))), h("zonos-link-authentication", { titleText: translate('Contact') }), h("zonos-address", { defaultAddress: this.defaultAddress, onInvalidCharacters: e => (this.hasInvalidShippingCharacters = e.detail), titleText: translate('Address'), type: "shipping" }), h("zonos-checkbox", { isChecked: stripeStore.stripeShippingSameAsBilling, label: translate('Shipping address same as billing'), onCheckboxSelected: e => {
                 stripeStore.stripeShippingSameAsBilling = e.detail;
-            } }), h("zonos-collapse", { collapsed: !showBilling }, h("zonos-address", { defaultAddress: this.defaultAddress, onInvalidCharacters: e => (this.hasInvalidBillingCharacters = e.detail), titleText: translate('Billing address'), type: "billing" })), h("div", { class: "zonos--group-btn" }, h("zonos-button", { backgroundColor: this.submitBtnColor, isDisabled: this.disabled, loading: this.continueLoading, onClick: () => this.continueClickHandler(), size: "lg",
+            } }), h("zonos-collapse", { collapsed: !showBilling }, h("zonos-address", { defaultAddress: this.defaultAddress, onInvalidCharacters: e => (this.hasInvalidBillingCharacters = e.detail), titleText: translate('Billing address'), type: "billing" })), h("div", { class: "zonos--group-btn" }, h("zonos-button", { backgroundColor: this.submitBtnColor, loading: this.continueLoading, onClick: () => this.continueClickHandler(), size: "lg",
             // use primary type when on mobile mode
             variant: this.submitBtnType }, translate('Continue to shipping'))))));
     }
     get el() { return this; }
-    static get watchers() { return {
-        "disabled": ["watchFormComplete"]
-    }; }
     static get style() { return ZonosCustomerInfoStyle0; }
 }, [2, "zonos-customer-info", {
         "continueLoading": [4, "continue-loading"],
         "submitBtnType": [1, "submit-btn-type"],
         "submitBtnColor": [1, "submit-btn-color"],
         "defaultAddress": [16],
-        "disabled": [32],
+        "showErrorBanner": [32],
         "hasInvalidShippingCharacters": [32],
         "hasInvalidBillingCharacters": [32]
-    }, undefined, {
-        "disabled": ["watchFormComplete"]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/components/zonos-dialog2.js CHANGED Viewed

@@ -57,7 +57,7 @@ const ZonosDialog = /*@__PURE__*/ proxyCustomElement(class ZonosDialog extends H
             document.body.style.overflow = 'auto';
         }
         const borderStyle = getBorderRadius(this.borderStyle);
-        return (h(Host, { key: 'b2f500bb70769f6d14d7e4002e5b11fe854e3bd1', class: classes([
+        return (h(Host, { key: 'cfa43ca3e1e64bbc9fb81dd35f07b5a2a57ef5a7', class: classes([
                 'zonos--elements',
                 this.open && 'open',
                 this.isLoading && 'is-loading',
@@ -68,10 +68,10 @@ const ZonosDialog = /*@__PURE__*/ proxyCustomElement(class ZonosDialog extends H
                 '--font-family': zonosStoreFontFamily(),
                 '--height': this.height || 'initial',
                 '--width': this.width,
-            } }, h("div", { key: '9715c4765caee524a8030b2baa9352e44d0eeec0', class: "zonos--backdrop" }), h("div", { key: '05357a1ab95c995a35602517555f33e14c712bcc', "aria-hidden": "true", class: "zonos--dialog-layout", onClick: this.clickOutsideDialogHandler }, h("div", { key: '6acbd0635fcfb95910c20db9d1803a3c2685f4ac', class: "zonos--dialog" }, this.isLoading && (h("div", { key: '5a94b2d158ffdd5c1d5b4b6e2d1cca60ff31fb10', class: "zonos--loading" }, h("zonos-spinner", { key: '80fe57fea64e1ac4a5eb286fe19c327230748837', size: 30 }))), (this.headerText || !this.noCloseButton) && (h("div", { key: '773b53526fc24469e41e927d50a0aadbc8470a4a', class: "zonos--header" }, this.headerText && (h("h3", { key: '9e9a754fdc82900b720ac5289b83d0217eb89517', class: "zonos--header-text" }, this.headerText)), !this.noCloseButton && (h("zonos-button", { key: '4525da6839849fd972f9b470e280f176803921ed', class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close dialog", content: RemoveIcon }), noBackground: true, onClick: this.closeButtonHandler })))), h("div", { key: '1c9ff5924f0fa9cdb7753fbcf0c2dc51171535b0', class: classes([
+            } }, h("div", { key: '967accb9ec4e552bab62bbec21fd0319d68828dc', class: "zonos--backdrop" }), h("div", { key: '37041f00cd3a996510f25708460a91baa527ed74', "aria-hidden": "true", class: "zonos--dialog-layout", onClick: this.clickOutsideDialogHandler }, h("div", { key: '571cfdac8125f10d380e06efc1464ddcaf1f335e', class: "zonos--dialog" }, this.isLoading && (h("div", { key: '200e75be392f6e8745ebbf2ddfa74aaf3d027caa', class: "zonos--loading" }, h("zonos-spinner", { key: 'a5d5a0d22a5d8ae5a22207716a7904d7031efa8d', size: 30 }))), (this.headerText || !this.noCloseButton) && (h("div", { key: '37800b1fd96b0ff6df2724b4d62ea133470fae2c', class: "zonos--header" }, this.headerText && (h("h3", { key: 'eb0ef1b8c3d82d889f76b18b15d98a19fa1480a1', class: "zonos--header-text" }, this.headerText)), !this.noCloseButton && (h("zonos-button", { key: '24b6945af71c51a35a09177e65d0b081abec75cb', class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close dialog", content: RemoveIcon }), noBackground: true, onClick: this.closeButtonHandler })))), h("div", { key: 'a9d913ce8af53e60ffbf8eeb41b6d4372e0d389e', class: classes([
                 'zonos--body',
                 this.noBodyPadding && 'zonos--no-body-padding',
-            ]) }, h("slot", { key: '96b0c127f550413a5108a6f87a8397a0c6e01e64' })), h("slot", { key: 'a5c64424aadb3a56682de39b497ecc0eafdf3de7', name: "dialog-footer" })))));
+            ]) }, h("slot", { key: '02c77f819baa6b1a684dfdf02b756ffa1fb55751' })), h("slot", { key: '0b469253c01c418d43d0865ae72d065d2a911aeb', name: "dialog-footer" })))));
     }
     static get assetsDirs() { return ["assets"]; }
     static get style() { return ZonosDialogStyle0; }

package/dist/components/zonos-hello-dialog-footer2.js CHANGED Viewed

@@ -19,7 +19,7 @@ const ZonosIcon = `<svg width="105" height="29" viewBox="0 0 105 29" fill="none"
 </svg>
 `;
-const zonosHelloDialogFooterCss = ":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}[data-theme=LIGHT],.zonos--elements{color-scheme:light;--amino-transition:all 0.2s ease-in-out 0s;--amino-type-scale-base:16px;--amino-glass-0:#10111600;--amino-glass-50:#1011160a;--amino-glass-100:#10111614;--amino-glass-200:#10111626;--amino-glass-300:#1011163d;--amino-glass-400:#10111656;--amino-glass-500:#10111670;--amino-glass-600:#1011169b;--amino-glass-700:#101116ad;--amino-glass-800:#101116bc;--amino-glass-900:#101116c6;--amino-glass-1000:#101116dd;--amino-glass-1100:#101116ef;--amino-glass-1200:#101116f5;--amino-gray-0:#ffffff;--amino-gray-50:#f6f6f8;--amino-gray-100:#eaebed;--amino-gray-200:#d9dadd;--amino-gray-300:#c5c6ca;--amino-gray-400:#acaeb3;--amino-gray-500:#94969e;--amino-gray-600:#6a6d77;--amino-gray-700:#5c5e68;--amino-gray-800:#4d505a;--amino-gray-900:#40424c;--amino-gray-1000:#2e3038;--amino-gray-1100:#1e1f26;--amino-gray-1200:#101116;--amino-blue-100:#deedfe;--amino-blue-200:#c5ddfd;--amino-blue-300:#aacbfc;--amino-blue-400:#89b2fa;--amino-blue-500:#5f92f6;--amino-blue-600:#445eee;--amino-blue-700:#364bd4;--amino-blue-800:#2c3baf;--amino-blue-900:#252e7e;--amino-blue-1000:#1c2154;--amino-cyan-100:#dbfffe;--amino-cyan-200:#bafdfd;--amino-cyan-300:#8ff6fa;--amino-cyan-400:#65e6ef;--amino-cyan-500:#4ec6d4;--amino-cyan-600:#37a5b4;--amino-cyan-700:#2c8896;--amino-cyan-800:#26707e;--amino-cyan-900:#245660;--amino-cyan-1000:#183339;--amino-red-100:#ffedeb;--amino-red-200:#fdd3d0;--amino-red-300:#fcb4b2;--amino-red-400:#fa8b8b;--amino-red-500:#f95c67;--amino-red-600:#d92141;--amino-red-700:#b4223d;--amino-red-800:#8c1d33;--amino-red-900:#641627;--amino-red-1000:#49121f;--amino-orange-100:#ffefe0;--amino-orange-200:#fed7b8;--amino-orange-300:#fdc7a0;--amino-orange-400:#fca975;--amino-orange-500:#f88c53;--amino-orange-600:#e5591a;--amino-orange-700:#b6471b;--amino-orange-800:#903a1d;--amino-orange-900:#692c1c;--amino-orange-1000:#441c13;--amino-green-100:#e0ffe3;--amino-green-200:#c8fdce;--amino-green-300:#a9f9b5;--amino-green-400:#7de490;--amino-green-500:#56c76f;--amino-green-600:#2b9c4d;--amino-green-700:#298549;--amino-green-800:#266e3e;--amino-green-900:#245234;--amino-green-1000:#1c3626;--amino-purple-100:#f4eeff;--amino-purple-200:#e7d8fd;--amino-purple-300:#ddc5fc;--amino-purple-400:#cea9fa;--amino-purple-500:#bd82f8;--amino-purple-600:#ab30ee;--amino-purple-700:#922bc5;--amino-purple-800:#742498;--amino-purple-900:#54206a;--amino-purple-1000:#3b1948;--amino-transparent-white:#ffffffbb;--amino-transparent-black:#101116bb;--amino-transparent-gray-600:#6a6d771f;--amino-v3-shadow-base:0px 0px 0px 1px rgba(110, 110, 120, 0.1),\n    0px 1px 2px rgba(10, 10, 11, 0.06), 0px 1px 3px rgba(10, 10, 11, 0.1);--amino-v3-shadow-medium:0px 0px 0px 1px rgba(110, 110, 120, 0.1),\n    0px 4px 6px rgba(10, 10, 11, 0.1), 0px 2px 4px rgba(10, 10, 11, 0.06);--amino-v3-shadow-large:0px 0px 0px 1px rgba(110, 110, 120, 0.1),\n    0px 10px 15px rgba(10, 10, 11, 0.1), 0px 4px 6px rgba(10, 10, 11, 0.05);--amino-v3-shadow-xl:0px 0px 0px 1px rgba(110, 110, 120, 0.1),\n    0px 20px 25px rgba(10, 10, 11, 0.1), 0px 10px 10px rgba(12, 12, 13, 0.04);--amino-v3-shadow-xxl:0px 0px 0px 1px rgba(110, 110, 120, 0.1),\n    0px 32px 50px rgba(10, 10, 11, 0.24);--amino-v3-shadow-inset:0px 1px 0px #ffffff, 0px 2px 4px rgba(0, 0, 0, 0.04),\n    inset 0px 1px 1px rgba(0, 0, 0, 0.04), inset 0px 2px 4px rgba(0, 0, 0, 0.04),\n    inset 0px 0px 0px 0.5px rgba(0, 0, 0, 0.06),\n    inset 0px 0px 8px rgba(0, 0, 0, 0.02);--amino-shadow-button-primary:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 1px 3px 0px rgba(68, 94, 238, 0.4);--amino-shadow-button-success:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 1px 3px 0px rgba(43, 156, 77, 0.4);--amino-shadow-button-danger:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 1px 3px 0px rgba(217, 33, 65, 0.4);--amino-shadow-button-warning:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 1px 3px 0px rgba(229, 89, 26, 0.4);--amino-button-focus-ring:0 0 0 2px var(--amino-blue-600);--amino-shadow-button-standard:0px 1px 3px 0px rgba(110, 110, 120, 0.12),\n    0px -1px 1px 1px rgba(0, 0, 0, 0.08) inset,\n    0px 0px 0px 1px rgba(106, 109, 119, 0.12) inset;--amino-space-negative-80:-5rem;--amino-space-negative-76:-4.75rem;--amino-space-negative-72:-4.5rem;--amino-space-negative-68:-4.25rem;--amino-space-negative-64:-4rem;--amino-space-negative-60:-3.75rem;--amino-space-negative-56:-3.5rem;--amino-space-negative-52:-3.25rem;--amino-space-negative-48:-3rem;--amino-space-negative-44:-2.75rem;--amino-space-negative-40:-2.5rem;--amino-space-negative-36:-2.25rem;--amino-space-negative-32:-2rem;--amino-space-negative-28:-1.75rem;--amino-space-negative-24:-1.5rem;--amino-space-negative-20:-1.25rem;--amino-space-negative-16:-1rem;--amino-space-negative-12:-0.75rem;--amino-space-negative-8:-0.5rem;--amino-space-negative-4:-0.25rem;--amino-space-0:0;--amino-space-4:0.25rem;--amino-space-8:0.5rem;--amino-space-12:0.75rem;--amino-space-16:1rem;--amino-space-20:1.25rem;--amino-space-24:1.5rem;--amino-space-28:1.75rem;--amino-space-32:2rem;--amino-space-36:2.25rem;--amino-space-40:2.5rem;--amino-space-44:2.75rem;--amino-space-48:3rem;--amino-space-52:3.25rem;--amino-space-56:3.5rem;--amino-space-60:3.75rem;--amino-space-64:4rem;--amino-space-68:4.25rem;--amino-space-72:4.5rem;--amino-space-76:4.75rem;--amino-space-80:5rem;--amino-border:1px solid var(--amino-border-color);--amino-border-blue:1px solid var(--amino-blue-500);--amino-border-red:1px solid var(--amino-red-400);--amino-border-cyan:1px solid var(--amino-cyan-400);--amino-border-orange:1px solid var(--amino-orange-400);--amino-border-green:1px solid var(--amino-green-400);--amino-border-purple:1px solid var(--amino-purple-400);--amino-border-amber:1px solid var(--amino-amber-400);--amino-border-transparent:1px solid transparent;--amino-sidebar-color:var(--amino-gray-0);--amino-header-color:var(--amino-gray-0);--amino-danger:var(--amino-red-600);--amino-danger-dark:var(--amino-red-700);--amino-error:var(--amino-red-600);--amino-primary:var(--amino-blue-600);--amino-primary-light:var(--amino-blue-500);--amino-primary-dark:var(--amino-blue-800);--amino-success:var(--amino-green-600);--amino-success-dark:var(--amino-green-700);--amino-warning:var(--amino-orange-600);--amino-warning-dark:var(--amino-orange-600);--amino-glow-error:0 0 0 1px var(--amino-red-600);--amino-glow-blue:0 0 0 1px var(--amino-primary);--amino-glow-cyan:0 0 0 1px var(--amino-cyan-600);--amino-glow-red:0 0 0 1px var(--amino-red-600);--amino-glow-orange:0 0 0 1px var(--amino-orange-600);--amino-glow-green:0 0 0 1px var(--amino-green-600);--amino-glow-purple:0 0 0 1px var(--amino-purple-600);--amino-page-background:var(--amino-gray-0);--amino-border-color:var(--amino-gray-200);--amino-hover-color:var(--amino-gray-50);--amino-text-color:var(--amino-gray-1000);--amino-text-color-secondary:var(--amino-gray-800);--amino-focus-button-standard:0px 0px 0px 1px\n      var(--amino-transparent-gray-600) inset,\n    var(--amino-button-focus-ring);--amino-focus-button:0px 0px 0px 1px var(--amino-gray-0) inset,\n    var(--amino-button-focus-ring);--amino-surface-color:var(--amino-gray-0);--amino-surface-color-secondary:var(--amino-gray-50);--amino-backdrop-color:var(--amino-gray-1200);--amino-button-primary-hover:linear-gradient(\n    180deg,\n    #445eee 0%,\n    #364bd4 100%\n  );--amino-button-success-hover:linear-gradient(\n    180deg,\n    #2b9c4d 0%,\n    #298549 100%\n  );--amino-button-danger-hover:linear-gradient(\n    180deg,\n    #d92141 0%,\n    #b4223d 100%\n  );--amino-button-warning-hover:linear-gradient(\n    180deg,\n    #e5591a 0%,\n    #b6471b 100%\n  );--amino-button-standard-hover:linear-gradient(180deg, #fff 0%, #eaebed 100%);--amino-spinner-track-black:rgba(0, 0, 0, 0.3);--amino-spinner-stroke-black:#0c0c0c;--amino-spinner-track-white:rgba(255, 255, 255, 0.3);--amino-spinner-stroke-white:#ffffff;--amino-appbar-height:55px;--amino-sidebar-width:232px;--amino-elevation-0:0;--amino-elevation-100:100;--amino-elevation-200:200;--amino-elevation-300:300;--amino-elevation-400:400;--amino-elevation-500:500;--amino-dialog-elevation:var(--amino-elevation-400);--amino-toast-elevation:var(--amino-elevation-500);--amino-appbar-elevation:var(--amino-elevation-500);--amino-size-xl:56px;--amino-size-lg:48px;--amino-size-md:40px;--amino-size-sm:32px;--amino-radius-4:0.25rem;--amino-radius-6:0.375rem;--amino-radius-8:0.5rem;--amino-radius-10:0.625rem;--amino-radius-12:0.75rem;--amino-font-size-3xl:2.125rem;--amino-font-size-2xl:1.75rem;--amino-font-size-xl:1.375rem;--amino-font-size-l:1.125rem;--amino-font-size-base-docs:1rem;--amino-font-size-base:0.875rem;--amino-font-size-s:0.75rem;--amino-font-size-xs:0.625rem;--amino-line-height-3xl:3rem;--amino-line-height-2xl:2.5rem;--amino-line-height-xl:2rem;--amino-line-height-l:1.5rem;--amino-line-height-base:1.5rem;--amino-line-height-s:1rem;--amino-line-height-xs:0.75rem;--amino-font-sans:\"Inter\", -apple-system, BlinkMacSystemFont, \"Segoe UI\",\n    \"Roboto\", \"Oxygen\", \"Ubuntu\", \"Cantarell\", \"Fira Sans\", \"Droid Sans\",\n    \"Helvetica Neue\", sans-serif;--amino-font-mono:Operator Mono, MonoLisa, Dank Mono, Menlo, Monaco,\n    Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono,\n    Courier New, monospace;--amino-font-harmonized-codes:\"Fira Code\", var(--amino-font-sans);--amino-input-background:inherit}[data-theme=DARK] .zonos--elements:not([data-theme=LIGHT]),.zonos--elements[data-theme=DARK],.zonos--elements [data-theme=DARK]{color-scheme:dark;--amino-glass-0:#ffffff00;--amino-glass-50:#ffffff0a;--amino-glass-100:#ffffff21;--amino-glass-200:#ffffff26;--amino-glass-300:#ffffff44;--amino-glass-400:#ffffff51;--amino-glass-500:#ffffff63;--amino-glass-600:#ffffff8e;--amino-glass-700:#ffffffa8;--amino-glass-800:#ffffffc1;--amino-glass-900:#ffffffd8;--amino-glass-1000:#ffffffea;--amino-glass-1100:#fffffff4;--amino-glass-1200:#fffffffa;--amino-gray-0:#101116;--amino-gray-50:#1e1f26;--amino-gray-100:#2e3038;--amino-gray-200:#40424c;--amino-gray-300:#4d505a;--amino-gray-400:#5c5e68;--amino-gray-500:#6a6d77;--amino-gray-600:#94969e;--amino-gray-700:#acaeb3;--amino-gray-800:#c5c6ca;--amino-gray-900:#d9dadd;--amino-gray-1000:#eaebed;--amino-gray-1100:#f6f6f8;--amino-gray-1200:#ffffff;--amino-blue-100:#1c2154;--amino-blue-200:#252e7e;--amino-blue-300:#2c3baf;--amino-blue-400:#364bd4;--amino-blue-500:#445eee;--amino-blue-600:#5f92f6;--amino-blue-700:#89b2fa;--amino-blue-800:#aacbfc;--amino-blue-900:#c5ddfd;--amino-blue-1000:#deedfe;--amino-cyan-100:#183339;--amino-cyan-200:#245660;--amino-cyan-300:#26707e;--amino-cyan-400:#2c8896;--amino-cyan-500:#37a5b4;--amino-cyan-600:#4ec6d4;--amino-cyan-700:#65e6ef;--amino-cyan-800:#8ff6fa;--amino-cyan-900:#bafdfd;--amino-cyan-1000:#dbfffe;--amino-red-100:#49121f;--amino-red-200:#641627;--amino-red-300:#8c1d33;--amino-red-400:#b4223d;--amino-red-500:#d92141;--amino-red-600:#f95c67;--amino-red-700:#fa8b8b;--amino-red-800:#fcb4b2;--amino-red-900:#fdd3d0;--amino-red-1000:#ffedeb;--amino-orange-100:#441c13;--amino-orange-200:#692c1c;--amino-orange-300:#903a1d;--amino-orange-400:#b6471b;--amino-orange-500:#e5591a;--amino-orange-600:#f88c53;--amino-orange-700:#fca975;--amino-orange-800:#fdc7a0;--amino-orange-900:#fed7b8;--amino-orange-1000:#ffefe0;--amino-green-100:#1c3626;--amino-green-200:#245234;--amino-green-300:#266e3e;--amino-green-400:#298549;--amino-green-500:#2b9c4d;--amino-green-600:#56c76f;--amino-green-700:#7de490;--amino-green-800:#a9f9b5;--amino-green-900:#c8fdce;--amino-green-1000:#e0ffe3;--amino-purple-100:#3b1948;--amino-purple-200:#54206a;--amino-purple-300:#742498;--amino-purple-400:#922bc5;--amino-purple-500:#ab30ee;--amino-purple-600:#bd82f8;--amino-purple-700:#cea9fa;--amino-purple-800:#ddc5fc;--amino-purple-900:#e7d8fd;--amino-purple-1000:#f4eeff;--amino-transparent-white:#101116bb;--amino-transparent-black:#ffffffbb;--amino-transparent-gray-600:#94969e1f;--amino-v3-shadow-base:0px 0px 0px 1px rgba(255, 255, 255, 0.12),\n    0px 1px 3px rgba(0, 0, 0, 0.9), 0px 1px 2px rgba(0, 0, 0, 0.8);--amino-v3-shadow-medium:0px 0px 0px 1px rgba(255, 255, 255, 0.12),\n    0px 4px 6px rgba(0, 0, 0, 0.9), 0px 2px 4px rgba(0, 0, 0, 0.8);--amino-v3-shadow-large:0px 0px 0px 1px rgba(255, 255, 255, 0.12),\n    0px 10px 15px rgba(0, 0, 0, 0.9), 0px 4px 6px rgba(0, 0, 0, 0.8);--amino-v3-shadow-xl:0px 0px 0px 1px rgba(255, 255, 255, 0.12),\n    0px 20px 25px rgba(0, 0, 0, 0.9), 0px 10px 10px rgba(0, 0, 0, 0.8);--amino-v3-shadow-xxl:0px 0px 0px 1px rgba(255, 255, 255, 0.12),\n    0px 32px 50px rgba(0, 0, 0, 0.96);--amino-v3-shadow-inset:0px 0px 0px 1px rgba(255, 255, 255, 0.12),\n    0px 0px 6px rgba(255, 255, 255, 0.08), 0px 1px 0px #111114,\n    0px 2px 4px rgba(0, 0, 0, 0.24), inset 0px 1px 1px rgba(0, 0, 0, 0.24),\n    inset 0px 2px 4px rgba(0, 0, 0, 0.24),\n    inset 0px 0px 0px 0.5px rgba(0, 0, 0, 0.24),\n    inset 0px 0px 8px rgba(0, 0, 0, 0.16);--amino-shadow-button-primary:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 0px 0px 0.5px #000, 0px 1px 3px 0px rgba(95, 146, 246, 0.4);--amino-shadow-button-success:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 0px 0px 1px rgba(255, 255, 255, 0.08) inset, 0px 0px 0px 0.5px #000,\n    0px 1px 3px 0px rgba(86, 199, 111, 0.6);--amino-shadow-button-danger:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 1px 3px 0px rgba(217, 33, 65, 0.4);--amino-shadow-button-warning:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 1px 3px 0px rgba(229, 89, 26, 0.4);--amino-button-focus-ring:0 0 0 2px var(--amino-blue-600);--amino-shadow-button-standard:0px -1px 1px 0px rgba(0, 0, 0, 0.4) inset,\n    0px 0px 2px 1px rgba(255, 255, 255, 0.08) inset,\n    0px 1px 3px 0px rgba(0, 0, 0, 0.8),\n    0px 0px 0px 1px rgba(148, 150, 158, 0.12) inset;--amino-border:1px solid var(--amino-border-color);--amino-border-blue:1px solid var(--amino-blue-500);--amino-border-red:1px solid var(--amino-red-400);--amino-border-cyan:1px solid var(--amino-cyan-400);--amino-border-orange:1px solid var(--amino-orange-400);--amino-border-green:1px solid var(--amino-green-400);--amino-border-purple:1px solid var(--amino-purple-400);--amino-border-amber:1px solid var(--amino-amber-400);--amino-border-transparent:1px solid transparent;--amino-sidebar-color:var(--amino-gray-0);--amino-header-color:var(--amino-gray-0);--amino-danger:var(--amino-red-600);--amino-danger-dark:var(--amino-red-700);--amino-error:var(--amino-red-600);--amino-primary:var(--amino-blue-600);--amino-primary-light:var(--amino-blue-500);--amino-primary-dark:var(--amino-blue-800);--amino-success:var(--amino-green-600);--amino-success-dark:var(--amino-green-700);--amino-warning:var(--amino-orange-600);--amino-warning-dark:var(--amino-orange-600);--amino-glow-error:0 0 0 1px var(--amino-red-600);--amino-glow-blue:0 0 0 1px var(--amino-primary);--amino-glow-cyan:0 0 0 1px var(--amino-cyan-600);--amino-glow-red:0 0 0 1px var(--amino-red-600);--amino-glow-orange:0 0 0 1px var(--amino-orange-600);--amino-glow-green:0 0 0 1px var(--amino-green-600);--amino-glow-purple:0 0 0 1px var(--amino-purple-600);--amino-page-background:var(--amino-gray-0);--amino-border-color:var(--amino-gray-200);--amino-hover-color:var(--amino-gray-50);--amino-text-color:var(--amino-gray-1000);--amino-text-color-secondary:var(--amino-gray-800);--amino-focus-button-standard:0px 0px 0px 1px\n      var(--amino-transparent-gray-600) inset,\n    var(--amino-button-focus-ring);--amino-focus-button:0px 0px 0px 1px var(--amino-gray-0) inset,\n    var(--amino-button-focus-ring);--amino-surface-color:var(--amino-gray-50);--amino-surface-color-secondary:var(--amino-gray-100);--amino-backdrop-color:var(--amino-gray-0);--amino-button-primary-hover:linear-gradient(\n    180deg,\n    #5f92f6 0%,\n    #89b2fa 100%\n  );--amino-button-success-hover:linear-gradient(\n    180deg,\n    #56c76f 0%,\n    #7de490 100%\n  );--amino-button-danger-hover:linear-gradient(\n    180deg,\n    #f95c67 0%,\n    #fa8b8b 100%\n  );--amino-button-warning-hover:linear-gradient(\n    180deg,\n    #f88c53 0%,\n    #fca975 100%\n  );--amino-button-standard-hover:linear-gradient(\n    180deg,\n    #1e1f26 0%,\n    #2e3038 100%\n  );--amino-spinner-track-black:rgba(255, 255, 255, 0.3);--amino-spinner-stroke-black:#ffffff;--amino-spinner-track-white:rgba(0, 0, 0, 0.3);--amino-spinner-stroke-white:#0c0c0c;}[data-theme=DARK] .zonos--elements:not([data-theme=LIGHT]) .elevated,.zonos--elements[data-theme=DARK] .elevated,.zonos--elements [data-theme=DARK] .elevated{--amino-hover-color:var(--amino-gray-100)}:host .zonos--hello-dialog-footer{text-align:left;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;background:var(--primary-color, var(--amino-surface-color-secondary));border-top:var(--amino-border);padding:var(--amino-space-12);-ms-flex-align:center;align-items:center}:host .zonos--hello-dialog-footer a{display:-ms-inline-flexbox;display:inline-flex}:host .zonos--hello-dialog-footer zonos-button button.outline{outline:1px solid var(--amino-gray-800)}:host .zonos--hello-dialog-footer .zonos--hello-locale-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:var(--amino-space-8)}@media (max-width: 400px){:host .zonos--hello-dialog-footer .zonos--hello-locale-wrapper{gap:var(--amino-space-4)}}";
+const zonosHelloDialogFooterCss = ":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}[data-theme=LIGHT],.zonos--elements{color-scheme:light;--amino-transition:all 0.2s ease-in-out 0s, visibility 0s;--amino-type-scale-base:16px;--amino-glass-0:#10111600;--amino-glass-50:#1011160a;--amino-glass-100:#10111614;--amino-glass-200:#10111626;--amino-glass-300:#1011163d;--amino-glass-400:#10111656;--amino-glass-500:#10111670;--amino-glass-600:#1011169b;--amino-glass-700:#101116ad;--amino-glass-800:#101116bc;--amino-glass-900:#101116c6;--amino-glass-1000:#101116dd;--amino-glass-1100:#101116ef;--amino-glass-1200:#101116f5;--amino-gray-0:#ffffff;--amino-gray-50:#f6f6f8;--amino-gray-100:#ebebf0;--amino-gray-200:#d9dae3;--amino-gray-300:#bfc0ce;--amino-gray-400:#a7a9b9;--amino-gray-500:#888d9f;--amino-gray-600:#676c7e;--amino-gray-700:#575c6b;--amino-gray-800:#484c5b;--amino-gray-900:#383a48;--amino-gray-1000:#2a2c37;--amino-gray-1100:#1a1c23;--amino-gray-1200:#101116;--amino-blue-100:#e7f6fe;--amino-blue-200:#c9e6fd;--amino-blue-300:#a3cbfa;--amino-blue-400:#7fa9f5;--amino-blue-500:#5a80f1;--amino-blue-600:#445eee;--amino-blue-700:#3843c2;--amino-blue-800:#2e3d94;--amino-blue-900:#212f68;--amino-blue-1000:#152141;--amino-cyan-100:#d6fffe;--amino-cyan-200:#c0f2f2;--amino-cyan-300:#9be7e9;--amino-cyan-400:#66d5db;--amino-cyan-500:#3ec4d0;--amino-cyan-600:#2ca0af;--amino-cyan-700:#29818e;--amino-cyan-800:#25646f;--amino-cyan-900:#1d464e;--amino-cyan-1000:#152d32;--amino-red-100:#ffeceb;--amino-red-200:#fdd0ce;--amino-red-300:#faa9a9;--amino-red-400:#f37c82;--amino-red-500:#eb5c6c;--amino-red-600:#de314f;--amino-red-700:#bc2442;--amino-red-800:#922033;--amino-red-900:#6c1b26;--amino-red-1000:#481419;--amino-orange-100:#fff1e0;--amino-orange-200:#fcdab8;--amino-orange-300:#f5c193;--amino-orange-400:#f7a464;--amino-orange-500:#f47a34;--amino-orange-600:#e5591a;--amino-orange-700:#bd3c1c;--amino-orange-800:#94301c;--amino-orange-900:#6b2a1a;--amino-orange-1000:#401d12;--amino-green-100:#defde8;--amino-green-200:#aff8c3;--amino-green-300:#81ef98;--amino-green-400:#57db6c;--amino-green-500:#39c049;--amino-green-600:#2ca03f;--amino-green-700:#288129;--amino-green-800:#246627;--amino-green-900:#1d4920;--amino-green-1000:#153219;--amino-purple-100:#edebff;--amino-purple-200:#dcd2fe;--amino-purple-300:#ceb5fd;--amino-purple-400:#c699fa;--amino-purple-500:#b25cf5;--amino-purple-600:#ab26ed;--amino-purple-700:#901cca;--amino-purple-800:#6e1e99;--amino-purple-900:#471d68;--amino-purple-1000:#2c1844;--amino-transparent-white:#ffffffbb;--amino-transparent-black:#101116bb;--amino-transparent-gray-600:#6a6d771f;--amino-v3-shadow-base:0px 1px 3px 0px rgba(10, 10, 11, 0.1),\n    0px 1px 2px rgba(10, 10, 11, 0.06), 0px 0px 0px 1px rgba(110, 110, 120, 0.1);--amino-v3-shadow-medium:0px 2px 4px 0px rgba(10, 10, 11, 0.06),\n    0px 4px 6px rgba(10, 10, 11, 0.1), 0px 0px 0px 1px rgba(110, 110, 120, 0.1);--amino-v3-shadow-large:0px 4px 6px 0px rgba(10, 10, 11, 0.05),\n    0px 10px 15px rgba(10, 10, 11, 0.1),\n    0px 0px 0px 1px rgba(110, 110, 120, 0.1);--amino-v3-shadow-xl:0px 10px 10px 0px rgba(12, 12, 13, 0.04),\n    0px 20px 25px rgba(10, 10, 11, 0.1),\n    0px 0px 0px 1px rgba(110, 110, 120, 0.1);--amino-v3-shadow-xxl:0px 32px 50px 0px rgba(10, 10, 11, 0.24),\n    0px 0px 0px 1px rgba(110, 110, 120, 0.1);--amino-v3-shadow-inset:0px 2px 4px rgba(0, 0, 0, 0.04),\n    0px 1px 0px 0px rgba(255, 255, 255, 1),\n    inset 0px 0px 8px rgba(0, 0, 0, 0.02),\n    inset 0px 0px 0px 0.5px rgba(0, 0, 0, 0.06),\n    inset 0px 2px 4px rgba(0, 0, 0, 0.04), inset 0px 1px 1px rgba(0, 0, 0, 0.04);--amino-shadow-button-primary:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 1px 3px 0px rgba(68, 94, 238, 0.4);--amino-shadow-button-success:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 1px 3px 0px rgba(43, 156, 77, 0.4);--amino-shadow-button-danger:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 1px 3px 0px rgba(217, 33, 65, 0.4);--amino-shadow-button-warning:0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 1px 3px 0px rgba(229, 89, 26, 0.4);--amino-button-focus-ring:0 0 0 2px var(--amino-blue-600);--amino-shadow-button-standard:0px 1px 3px 0px rgba(110, 110, 120, 0.12),\n    0px -1px 1px 1px rgba(0, 0, 0, 0.08) inset,\n    0px 0px 0px 1px rgba(106, 109, 119, 0.12) inset;--amino-shadow-button-disabled:0px 1px 3px 0px rgba(16, 17, 22, 0.2),\n    0px -1px 1px 1px rgba(0, 0, 0, 0.08) inset;--amino-shadow-select-base:0px 1px 3px 0px rgba(110, 110, 120, 0.12),\n    0px -1px 1px 1px rgba(0, 0, 0, 0.08) inset,\n    0px 0px 0px 1px rgba(106, 109, 119, 0.12) inset;--amino-shadow-select-active:0px 1px 3px 0px rgba(68, 94, 238, 0.4),\n    0px 0px 0px 1px #445eee inset,\n    0px -1px 1px 1px rgba(68, 94, 238, 0.12) inset;--amino-shadow-select-error:0px 1px 3px 0px rgba(221, 49, 78, 0.4),\n    0px 0px 0px 1px #dd314e inset,\n    0px -1px 1px 1px rgba(221, 49, 78, 0.12) inset;--amino-opacity-disabled:0.6;--amino-space-negative-80:-5rem;--amino-space-negative-76:-4.75rem;--amino-space-negative-72:-4.5rem;--amino-space-negative-68:-4.25rem;--amino-space-negative-64:-4rem;--amino-space-negative-60:-3.75rem;--amino-space-negative-56:-3.5rem;--amino-space-negative-52:-3.25rem;--amino-space-negative-48:-3rem;--amino-space-negative-44:-2.75rem;--amino-space-negative-40:-2.5rem;--amino-space-negative-36:-2.25rem;--amino-space-negative-32:-2rem;--amino-space-negative-28:-1.75rem;--amino-space-negative-24:-1.5rem;--amino-space-negative-20:-1.25rem;--amino-space-negative-16:-1rem;--amino-space-negative-12:-0.75rem;--amino-space-negative-8:-0.5rem;--amino-space-negative-4:-0.25rem;--amino-space-0:0;--amino-space-4:0.25rem;--amino-space-8:0.5rem;--amino-space-12:0.75rem;--amino-space-16:1rem;--amino-space-20:1.25rem;--amino-space-24:1.5rem;--amino-space-28:1.75rem;--amino-space-32:2rem;--amino-space-36:2.25rem;--amino-space-40:2.5rem;--amino-space-44:2.75rem;--amino-space-48:3rem;--amino-space-52:3.25rem;--amino-space-56:3.5rem;--amino-space-60:3.75rem;--amino-space-64:4rem;--amino-space-68:4.25rem;--amino-space-72:4.5rem;--amino-space-76:4.75rem;--amino-space-80:5rem;--amino-border:1px solid var(--amino-border-color);--amino-border-blue:1px solid var(--amino-blue-500);--amino-border-red:1px solid var(--amino-red-400);--amino-border-cyan:1px solid var(--amino-cyan-400);--amino-border-orange:1px solid var(--amino-orange-400);--amino-border-green:1px solid var(--amino-green-400);--amino-border-purple:1px solid var(--amino-purple-400);--amino-border-amber:1px solid var(--amino-amber-400);--amino-border-transparent:1px solid transparent;--amino-border-subtle:1px solid var(--amino-gray-100);--amino-sidebar-color:var(--amino-gray-0);--amino-header-color:var(--amino-gray-0);--amino-danger:var(--amino-red-600);--amino-danger-dark:var(--amino-red-700);--amino-error:var(--amino-red-600);--amino-primary:var(--amino-blue-600);--amino-primary-light:var(--amino-blue-500);--amino-primary-dark:var(--amino-blue-800);--amino-success:var(--amino-green-600);--amino-success-dark:var(--amino-green-700);--amino-warning:var(--amino-orange-600);--amino-warning-dark:var(--amino-orange-600);--amino-glow-error:0 0 0 1px var(--amino-red-600);--amino-glow-blue:0 0 0 1px var(--amino-primary);--amino-glow-cyan:0 0 0 1px var(--amino-cyan-600);--amino-glow-red:0 0 0 1px var(--amino-red-600);--amino-glow-orange:0 0 0 1px var(--amino-orange-600);--amino-glow-green:0 0 0 1px var(--amino-green-600);--amino-glow-purple:0 0 0 1px var(--amino-purple-600);--amino-page-background:var(--amino-gray-0);--amino-border-color:var(--amino-gray-200);--amino-hover-color:var(--amino-gray-50);--amino-text-color:var(--amino-gray-1200);--amino-text-color-secondary:var(--amino-gray-800);--amino-focus-button-standard:0px 0px 0px 1px\n      var(--amino-transparent-gray-600) inset,\n    var(--amino-button-focus-ring);--amino-focus-button:0px 0px 0px 1px var(--amino-gray-0) inset,\n    var(--amino-button-focus-ring);--amino-surface-color:var(--amino-gray-0);--amino-surface-color-secondary:var(--amino-gray-50);--amino-backdrop-color:#000000;--amino-raised-surface-color:var(--amino-gray-0);--amino-raised-color-secondary:var(--amino-gray-50);--amino-button-primary-hover:linear-gradient(\n    180deg,\n    #445eee 0%,\n    #364bd4 100%\n  );--amino-button-success-hover:linear-gradient(\n    180deg,\n    #2b9c4d 0%,\n    #298549 100%\n  );--amino-button-danger-hover:linear-gradient(\n    180deg,\n    #d92141 0%,\n    #b4223d 100%\n  );--amino-button-warning-hover:linear-gradient(\n    180deg,\n    #e5591a 0%,\n    #b6471b 100%\n  );--amino-button-standard-hover:linear-gradient(180deg, #fff 0%, #eaebed 100%);--amino-spinner-track-black:rgba(0, 0, 0, 0.3);--amino-spinner-stroke-black:#0c0c0c;--amino-spinner-track-white:rgba(255, 255, 255, 0.3);--amino-spinner-stroke-white:#ffffff;--amino-appbar-height:55px;--amino-sidebar-width:232px;--amino-elevation-0:0;--amino-elevation-100:100;--amino-elevation-200:200;--amino-elevation-300:300;--amino-elevation-400:400;--amino-elevation-500:500;--amino-dialog-elevation:var(--amino-elevation-400);--amino-toast-elevation:var(--amino-elevation-500);--amino-appbar-elevation:var(--amino-elevation-500);--amino-size-xl:56px;--amino-size-lg:48px;--amino-size-md:40px;--amino-size-sm:32px;--amino-radius-4:0.25rem;--amino-radius-6:0.375rem;--amino-radius-8:0.5rem;--amino-radius-10:0.625rem;--amino-radius-12:0.75rem;--amino-font-size-3xl:1.875rem;--amino-font-size-2xl:1.5rem;--amino-font-size-xl:1.25rem;--amino-font-size-l:1.125rem;--amino-font-size-base-docs:1rem;--amino-font-size-base:0.813rem;--amino-font-size-s:0.75rem;--amino-font-size-xs:0.688rem;--amino-line-height-3xl:3rem;--amino-line-height-2xl:2.5rem;--amino-line-height-xl:2rem;--amino-line-height-l:1.5rem;--amino-line-height-base:1.5rem;--amino-line-height-s:1rem;--amino-line-height-xs:0.75rem;--amino-font-sans:\"Inter\", -apple-system, BlinkMacSystemFont, \"Segoe UI\",\n    \"Roboto\", \"Oxygen\", \"Ubuntu\", \"Cantarell\", \"Fira Sans\", \"Droid Sans\",\n    \"Helvetica Neue\", sans-serif;--amino-font-mono:Operator Mono, MonoLisa, Dank Mono, Menlo, Monaco,\n    Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono,\n    Courier New, monospace;--amino-font-harmonized-codes:\"Fira Code\", var(--amino-font-sans);--amino-input-background:inherit}[data-theme=DARK] .zonos--elements:not([data-theme=LIGHT]),.zonos--elements[data-theme=DARK],.zonos--elements [data-theme=DARK]{color-scheme:dark;--amino-glass-0:#ffffff00;--amino-glass-50:#ffffff0a;--amino-glass-100:#ffffff21;--amino-glass-200:#ffffff26;--amino-glass-300:#ffffff44;--amino-glass-400:#ffffff51;--amino-glass-500:#ffffff63;--amino-glass-600:#ffffff8e;--amino-glass-700:#ffffffa8;--amino-glass-800:#ffffffc1;--amino-glass-900:#ffffffd8;--amino-glass-1000:#ffffffea;--amino-glass-1100:#fffffff4;--amino-glass-1200:#fffffffa;--amino-gray-0:#101116;--amino-gray-50:#1a1c23;--amino-gray-100:#2a2c37;--amino-gray-200:#383a48;--amino-gray-300:#484c5b;--amino-gray-400:#575c6b;--amino-gray-500:#676c7e;--amino-gray-600:#888d9f;--amino-gray-700:#a7a9b9;--amino-gray-800:#bfc0ce;--amino-gray-900:#d9dae3;--amino-gray-1000:#ebebf0;--amino-gray-1100:#f6f6f8;--amino-gray-1200:#ffffff;--amino-blue-100:#152141;--amino-blue-200:#212f68;--amino-blue-300:#2e3d94;--amino-blue-400:#3843c2;--amino-blue-500:#445eee;--amino-blue-600:#5a80f1;--amino-blue-700:#7fa9f5;--amino-blue-800:#a8cefa;--amino-blue-900:#c9e6fd;--amino-blue-1000:#e7f6fe;--amino-cyan-100:#152d32;--amino-cyan-200:#1d464e;--amino-cyan-300:#25646f;--amino-cyan-400:#29818e;--amino-cyan-500:#2ca0af;--amino-cyan-600:#3ec4d0;--amino-cyan-700:#66d5db;--amino-cyan-800:#9be7e9;--amino-cyan-900:#c0f2f2;--amino-cyan-1000:#d6fffe;--amino-red-100:#481419;--amino-red-200:#6c1b26;--amino-red-300:#922033;--amino-red-400:#bc2442;--amino-red-500:#de314f;--amino-red-600:#eb5c6c;--amino-red-700:#f37c82;--amino-red-800:#faa9a9;--amino-red-900:#fdd0ce;--amino-red-1000:#ffeceb;--amino-orange-100:#401d12;--amino-orange-200:#6b2a1a;--amino-orange-300:#94301c;--amino-orange-400:#bd3c1c;--amino-orange-500:#e5591a;--amino-orange-600:#f47a34;--amino-orange-700:#f7a464;--amino-orange-800:#f5c193;--amino-orange-900:#fcdab8;--amino-orange-1000:#fff1e0;--amino-green-100:#153219;--amino-green-200:#1d4920;--amino-green-300:#246627;--amino-green-400:#288129;--amino-green-500:#2ca03f;--amino-green-600:#39c049;--amino-green-700:#57db6c;--amino-green-800:#81ef98;--amino-green-900:#aff8c3;--amino-green-1000:#defde8;--amino-purple-100:#2c1844;--amino-purple-200:#471d68;--amino-purple-300:#6e1e99;--amino-purple-400:#901cca;--amino-purple-500:#ab26ed;--amino-purple-600:#b25cf5;--amino-purple-700:#c699fa;--amino-purple-800:#ceb5fd;--amino-purple-900:#dcd2fe;--amino-purple-1000:#edebff;--amino-transparent-white:#101116bb;--amino-transparent-black:#ffffffbb;--amino-transparent-gray-600:#94969e1f;--amino-v3-shadow-base:0px 1px 4px 0px rgba(0, 0, 0, 0.7),\n    0px 1px 3px rgba(0, 0, 0, 0.6), 0px 0px 0px 1px rgba(255, 255, 255, 0.12);--amino-v3-shadow-medium:0px 2px 4px 0px rgba(0, 0, 0, 0.6),\n    0px 4px 6px rgba(0, 0, 0, 0.7), 0px 0px 0px 1px rgba(255, 255, 255, 0.12);--amino-v3-shadow-large:0px 4px 6px 0px rgba(0, 0, 0, 0.6),\n    0px 10px 15px rgba(0, 0, 0, 0.7), 0px 0px 0px 1px rgba(255, 255, 255, 0.12);--amino-v3-shadow-xl:0px 10px 10px 0px rgba(0, 0, 0, 0.6),\n    0px 20px 25px rgba(0, 0, 0, 0.7), 0px 0px 0px 1px rgba(255, 255, 255, 0.12);--amino-v3-shadow-xxl:0px 32px 50px 0px rgba(0, 0, 0, 0.7),\n    0px 0px 0px 1px rgba(255, 255, 255, 0.12);--amino-v3-shadow-inset:0px 2px 4px rgba(0, 0, 0, 0.24),\n    0px 1px 0px rgba(17, 17, 20, 1), inset 0px 0px 8px rgba(0, 0, 0, 0.16),\n    inset 0px 0px 0px 0.5px rgba(0, 0, 0, 0.24),\n    inset 0px 2px 4px rgba(0, 0, 0, 0.24), inset 0px 1px 1px rgba(0, 0, 0, 0.24),\n    0px 0px 6px rgba(255, 255, 255, 0.08),\n    0px 0px 0px 1px rgba(255, 255, 255, 0.12);--amino-shadow-button-primary:0px 0px 0px 1px #000,\n    0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 0px 0px 1px rgba(255, 255, 255, 0.08) inset,\n    0px 1px 3px 0px rgba(95, 146, 246, 0.4);--amino-shadow-button-success:0px 0px 0px 1px #000,\n    0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 0px 0px 1px rgba(255, 255, 255, 0.08) inset,\n    0px 1px 3px 0px rgba(86, 199, 111, 0.6);--amino-shadow-button-danger:0px 0px 0px 1px #000,\n    0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 0px 0px 1px rgba(255, 255, 255, 0.08) inset,\n    0px 1px 3px 0px rgba(249, 92, 103, 0.6);--amino-shadow-button-warning:0px 0px 0px 1px #000,\n    0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 0px 0px 1px rgba(255, 255, 255, 0.08) inset,\n    0px 1px 3px 0px rgba(248, 140, 83, 0.6);--amino-button-focus-ring:0 0 0 2px var(--amino-blue-600);--amino-shadow-button-standard:0px 0px 0px 1px #000,\n    0px -1px 1px 0px rgba(0, 0, 0, 0.4) inset,\n    0px 0px 2px 1px rgba(255, 255, 255, 0.08) inset,\n    0px 1px 3px 0px rgba(0, 0, 0, 0.8),\n    0px 0px 0px 1px rgba(148, 150, 158, 0.12) inset;--amino-shadow-button-disabled:0px 0px 0px 1px #000,\n    0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,\n    0px 0px 0px 1px rgba(255, 255, 255, 0.08) inset,\n    0px 1px 3px 0px rgba(255, 255, 255, 0);--amino-shadow-select-base:0px 0px 0px 1px #000,\n    0px -1px 1px 0px rgba(0, 0, 0, 0.4) inset,\n    0px 0px 2px 1px rgba(255, 255, 255, 0.08) inset,\n    0px 1px 3px 0px rgba(0, 0, 0, 0.8),\n    0px 0px 0px 1px rgba(148, 150, 158, 0.12) inset;--amino-shadow-select-active:0px 0px 0px 1px #000,\n    0px -1px 1px 1px rgba(114, 146, 243, 0.24) inset,\n    0px 0px 0px 1px #7292f3 inset, 0px 1px 3px 0px rgba(114, 146, 243, 0.4);--amino-shadow-select-error:0px 0px 0px 1px #000,\n    0px -1px 1px 1px rgba(235, 92, 108, 0.24) inset,\n    0px 0px 0px 1px #eb5c6c inset, 0px 1px 3px 0px rgba(235, 92, 108, 0.6);--amino-border:1px solid var(--amino-border-color);--amino-border-blue:1px solid var(--amino-blue-500);--amino-border-red:1px solid var(--amino-red-400);--amino-border-cyan:1px solid var(--amino-cyan-400);--amino-border-orange:1px solid var(--amino-orange-400);--amino-border-green:1px solid var(--amino-green-400);--amino-border-purple:1px solid var(--amino-purple-400);--amino-border-amber:1px solid var(--amino-amber-400);--amino-border-transparent:1px solid transparent;--amino-border-subtle:1px solid var(--amino-gray-100);--amino-sidebar-color:var(--amino-gray-0);--amino-header-color:var(--amino-gray-0);--amino-danger:var(--amino-red-600);--amino-danger-dark:var(--amino-red-700);--amino-error:var(--amino-red-600);--amino-primary:var(--amino-blue-600);--amino-primary-light:var(--amino-blue-500);--amino-primary-dark:var(--amino-blue-800);--amino-success:var(--amino-green-600);--amino-success-dark:var(--amino-green-700);--amino-warning:var(--amino-orange-600);--amino-warning-dark:var(--amino-orange-600);--amino-glow-error:0 0 0 1px var(--amino-red-600);--amino-glow-blue:0 0 0 1px var(--amino-primary);--amino-glow-cyan:0 0 0 1px var(--amino-cyan-600);--amino-glow-red:0 0 0 1px var(--amino-red-600);--amino-glow-orange:0 0 0 1px var(--amino-orange-600);--amino-glow-green:0 0 0 1px var(--amino-green-600);--amino-glow-purple:0 0 0 1px var(--amino-purple-600);--amino-page-background:var(--amino-gray-0);--amino-border-color:var(--amino-gray-200);--amino-hover-color:var(--amino-gray-50);--amino-text-color:var(--amino-gray-1200);--amino-text-color-secondary:var(--amino-gray-800);--amino-focus-button-standard:0px 0px 0px 1px\n      var(--amino-transparent-gray-600) inset,\n    var(--amino-button-focus-ring);--amino-focus-button:0px 0px 0px 1px var(--amino-gray-0) inset,\n    var(--amino-button-focus-ring);--amino-surface-color:var(--amino-gray-50);--amino-surface-color-secondary:var(--amino-gray-100);--amino-backdrop-color:#000000;--amino-raised-surface-color:#2c2e3899;--amino-raised-color-secondary:var(--amino-gray-0);--amino-button-primary-hover:linear-gradient(\n    180deg,\n    #5a80f1 0%,\n    #7fa9f5 100%\n  );--amino-button-success-hover:linear-gradient(\n    180deg,\n    #39c049 0%,\n    #57db6c 100%\n  );--amino-button-danger-hover:linear-gradient(\n    180deg,\n    #e9495c 0%,\n    #f37c82 100%\n  );--amino-button-warning-hover:linear-gradient(\n    180deg,\n    #f47a34 0%,\n    #f7a464 100%\n  );--amino-button-standard-hover:linear-gradient(180deg, #2c2e3800, #2c2e38e5);--amino-spinner-track-black:rgba(255, 255, 255, 0.3);--amino-spinner-stroke-black:#ffffff;--amino-spinner-track-white:rgba(0, 0, 0, 0.3);--amino-spinner-stroke-white:#0c0c0c;}[data-theme=DARK] .zonos--elements:not([data-theme=LIGHT]) .elevated,.zonos--elements[data-theme=DARK] .elevated,.zonos--elements [data-theme=DARK] .elevated{--amino-hover-color:var(--amino-gray-100)}:host .zonos--hello-dialog-footer{text-align:left;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;background:var(--primary-color, var(--amino-surface-color-secondary));border-top:var(--amino-border);padding:var(--amino-space-12);-ms-flex-align:center;align-items:center}:host .zonos--hello-dialog-footer a{display:-ms-inline-flexbox;display:inline-flex}:host .zonos--hello-dialog-footer zonos-button button.outline{outline:1px solid var(--amino-gray-800)}:host .zonos--hello-dialog-footer .zonos--hello-locale-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:var(--amino-space-8)}@media (max-width: 400px){:host .zonos--hello-dialog-footer .zonos--hello-locale-wrapper{gap:var(--amino-space-4)}}";
 const ZonosHelloDialogFooterStyle0 = zonosHelloDialogFooterCss;
 const ZonosHelloDialogFooter = /*@__PURE__*/ proxyCustomElement(class ZonosHelloDialogFooter extends HTMLElement {
@@ -36,9 +36,9 @@ const ZonosHelloDialogFooter = /*@__PURE__*/ proxyCustomElement(class ZonosHello
         const primaryColor = (_a = this.appearanceSettings) === null || _a === void 0 ? void 0 : _a.colorPrimary;
         const footerTheme = primaryColor && isDarkColor(primaryColor) ? 'DARK' : 'LIGHT';
         const language = (_b = languages.find(x => x.code === localizationStore.selectedLocale)) === null || _b === void 0 ? void 0 : _b.translatedLabel;
-        return (h(Host, { key: '046b97e6ed7c35e5e9a244d0ffc3b59dfd206a8a', class: "zonos--elements" }, h("div", { key: '9134e27c1ec407b7661b6b92cd37cd17333e0f15', class: "zonos--hello-dialog-footer", "data-theme": footerTheme, style: {
+        return (h(Host, { key: '6f6371c5650d77a11d8a2f049859446ffb39e78f', class: "zonos--elements" }, h("div", { key: '47efc7a11c14ac4fc60472baea2d43f132eb2b07', class: "zonos--hello-dialog-footer", "data-theme": footerTheme, style: {
                 '--primary-color': (_c = this.appearanceSettings) === null || _c === void 0 ? void 0 : _c.colorPrimary,
-            } }, h("a", { key: '670c4627ff0297e2a4869a00e19032b3289396d7', href: "https://zonos.com", target: "_blank", title: "Zonos website" }, h("zonos-icon", { key: 'b67dd84bc4a4a245a0f2117e5b063df659f12ef9', "aria-label": "Zonos Logo", autoHeight: true, content: ZonosIcon, iconColor: "gray-1200", size: 108 })), h("div", { key: '823af21d0e96c52eed9cb9b6b13faf875bba13c8', class: "zonos--hello-locale-wrapper" }, h("zonos-button", { key: 'edd4b9d15b9e2f5051bd5e3e524fcd0d93e66543', buttonColor: "gray-1200", icon: h("zonos-icon", { "aria-label": "Open language select", content: Globe, iconColor: "gray-1200" }), onClick: () => this.setShowLanguageSelect(true), variant: "subtle" }, language), h("zonos-button", { key: 'f350f61d47eb93d7ac8ebc5c8faddc932262f990', buttonColor: "gray-1200", icon: h("zonos-country-flag", { "aria-label": "Open country select", class: "zonos--footer-country-flag", countryCode: localizationStore.selectedCountryCode }), onClick: () => this.setShowCountrySelect(true), variant: "subtle" }, localizationStore.selectedCountryCode)))));
+            } }, h("a", { key: 'a34ae0513d778695aa5cc2051774e0105ec93c4e', href: "https://zonos.com", target: "_blank", title: "Zonos website" }, h("zonos-icon", { key: 'e3e558d3759a2ccffa44e8b70603ec4860fe219a', "aria-label": "Zonos Logo", autoHeight: true, content: ZonosIcon, iconColor: "gray-1200", size: 108 })), h("div", { key: 'f76d9dff90b3e95db704a43f48abfd12938bdd7c', class: "zonos--hello-locale-wrapper" }, h("zonos-button", { key: 'b3430483773438b84a05fc1850c75231f25ecb5c', buttonColor: "gray-1200", icon: h("zonos-icon", { "aria-label": "Open language select", content: Globe, iconColor: "gray-1200" }), onClick: () => this.setShowLanguageSelect(true), variant: "subtle" }, language), h("zonos-button", { key: '351024225e4fb74e321b64fbdfe5b6b471d71077', buttonColor: "gray-1200", icon: h("zonos-country-flag", { "aria-label": "Open country select", class: "zonos--footer-country-flag", countryCode: localizationStore.selectedCountryCode }), onClick: () => this.setShowCountrySelect(true), variant: "subtle" }, localizationStore.selectedCountryCode)))));
     }
     static get style() { return ZonosHelloDialogFooterStyle0; }
 }, [1, "zonos-hello-dialog-footer", {

package/dist/components/zonos-hello-dialog2.js CHANGED Viewed

@@ -200,17 +200,17 @@ const ZonosHelloDialog = /*@__PURE__*/ proxyCustomElement(class ZonosHelloDialog
         const defaultMessage = formatStringWithLinks(defaultMessageStr);
         const currentPage = this.getCurrentPageEnum();
         const filteredMessages = customMessages.filter(x => x.pageName === currentPage);
-        return (h(Host, { key: 'f300db080cf0634c72aae93aceae288ce67c500c', class: "zonos--elements" }, h("div", { key: 'e61bbf7022be71909ab56267721026f95b9fc2fc', "aria-hidden": "true", class: classes([
+        return (h(Host, { key: '5457afc57069ca9ee6b31c2d3678965e59e275ed', class: "zonos--elements" }, h("div", { key: '4b4e974fce33cf88e7627a9513222453d25fe103', "aria-hidden": "true", class: classes([
                 'zonos--hello-dialog',
                 animateLeft && 'zonos--hello-dialog-animate-from-left',
                 animateFromBottom && 'zonos--hello-dialog-animate-from-bottom',
                 !!this.mobileLocationOverride &&
                     'zonos--hello-dialog-mobile-override',
                 this.isOpen && 'zonos--hello-dialog-open',
-            ]), ref: el => el && (this.dialogRef = el) }, !this.showCountrySelect && !this.showLanguageSelect && (h("div", { key: '909e251587e2650dbdc1afe5b19e9b3a55f72a18' }, h("div", { key: 'a4a79886507449ba688c87474d064528cae3779b', class: "zonos--hello-dialog-content" }, h("zonos-button", { key: '1e7a3e74f3f5ab94a70983a067cc08d596d9c5be', class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close Zonos Hello dialog", content: RemoveIcon }), noBackground: true, onClick: () => this.setIsOpen(false) }), h("zonos-v-stack", { key: '1c981178390c120427d61f68a05808a95f8da72a', spacing: 24 }, h("zonos-country-flag", { key: '095e060cf50ee4525ea501e682735370c0c03cfa', class: "zonos--hello-country-flag", countryCode: selectedCountryCode }), h("zonos-v-stack", { key: '1db18e95118922462526c7092accf42639bd4fdd', class: "zonos--hello-dialog-header", spacing: 4 }, h("zonos-text", { key: 'f494d050c90922328f3e8ea3bd05e1cf9e6d239c', type: "boldSubheader" }, welcomeMessage), h("zonos-text", { key: 'b31645d57a3c5f25eb59b61482d4e383e3cb962c', innerHTML: defaultMessage, textColor: "gray-800" })), h("zonos-v-stack", { key: '1e8f0a656074cd830715d19685c2a3c9daced9be', spacing: 8 }, this.restrictedItems.map(item => {
+            ]), ref: el => el && (this.dialogRef = el) }, !this.showCountrySelect && !this.showLanguageSelect && (h("div", { key: 'a27fd25bcc42d984b96991fa41c62dc7f2c8fb3c' }, h("div", { key: 'a83e94def52065d49155eadce134edc5bdfd9f8a', class: "zonos--hello-dialog-content" }, h("zonos-button", { key: 'db53cddaf04b1bd860287dcc70c6906bec71d6a3', class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close Zonos Hello dialog", content: RemoveIcon }), noBackground: true, onClick: () => this.setIsOpen(false) }), h("zonos-v-stack", { key: 'b23609e6727a8b0d7085dc5c96e2034382aae992', spacing: 24 }, h("zonos-country-flag", { key: 'd32019b849190e902b923c5bd82b8b293d1d2431', class: "zonos--hello-country-flag", countryCode: selectedCountryCode }), h("zonos-v-stack", { key: 'c063e4bb526b1b24ec687c80d42ebd9b18d704b6', class: "zonos--hello-dialog-header", spacing: 4 }, h("zonos-text", { key: 'a631361f2d44b1e21e91a1f4ff303da7101cdbef', type: "boldSubheader" }, welcomeMessage), h("zonos-text", { key: 'c887a9764256420faa51973733a4ce4b6ba9c87a', innerHTML: defaultMessage, textColor: "gray-800" })), h("zonos-v-stack", { key: 'ce5cf5c6edad63ccd06204fd6e28f07619ff92db', spacing: 8 }, this.restrictedItems.map(item => {
             var _a;
             return item && (h("zonos-banner", { bannerTitle: item.name, intent: "error" }, (_a = item.itemRestrictions) === null || _a === void 0 ? void 0 : _a.map(x => (h("zonos-text", { textColor: "red-800" }, x === null || x === void 0 ? void 0 : x.note)))));
-        }), h("zonos-card", { key: 'fd2c574714b2e0dafacb4f9390c81b7b6003c7d3', spacing: "12px" }, h("zonos-v-stack", { key: '41a9864f58ddc28f1767113f517a7a9cf3a0be6d', spacing: 12 }, h("div", { key: 'ced705bcf185987815a898a173d08c571017a052', class: "zonos--flex-message" }, h("zonos-icon", { key: '4724edca926eec5e050c711dcb96c6b914985695', "aria-label": "Duty de minimis", content: ImportIcon }), h("zonos-text", { key: '6c6d3b36897fd141ca83fbf008dae9f24ac56e40' }, dutyDeMinimisMessage)), h("div", { key: 'abe17715558f2ee3ded882eb2c5c1466904bfc8e', class: "zonos--flex-message" }, h("zonos-icon", { key: 'e8371f1e89a5b21947bfdcf73e6294bd6de49946', "aria-label": "Tax de minimis", content: MoneyIcon }), h("zonos-text", { key: '952485295cfec2d7ad1b61523bb05378bae08e34' }, taxDeMinimisMessage)), additionalInformation && (h("div", { key: 'abc0e4c7ddecbe85dd8f4b8adab15073b1b6a2db', class: "zonos--flex-message" }, h("zonos-icon", { key: '973ea223a40648ca8cac99bd0c839dd324894f1c', "aria-label": "Low value order shipping restriction", content: BagIcon }), h("zonos-text", { key: 'c6460eefa388097ed27e29d3a91055afbf8a5261' }, additionalInformation))))), filteredMessages.map(x => (h("zonos-custom-message", { icon: MessageIcon, message: x.message })))))), h("zonos-hello-dialog-footer", { key: 'daabdaf6f1f59e6e2ef3ad7516af60eb50a34633', appearanceSettings: this.appearanceSettings, setShowCountrySelect: value => this.setShowCountrySelect(value), setShowLanguageSelect: value => this.setShowLanguageSelect(value) }))), this.showCountrySelect && (h("div", { key: '88608070d3a34b3742eeac74cb836b98ddb171eb' }, h("zonos-country-select", { key: '91acd80a1549277528927512e9d299282a0e3d26', handleOnClose: () => this.setShowCountrySelect(false) }))), this.showLanguageSelect && (h("div", { key: '5b70e70778b8e863d1f256406f884179a01d9de2' }, h("zonos-language-select", { key: 'ba74dfc5baa25694dec9273c08644db8cd312dc1', handleOnClose: () => this.setShowLanguageSelect(false) }))))));
+        }), h("zonos-card", { key: '4352b1c30bf2e07a330efebc0f7315bd1ac567a8', spacing: "12px" }, h("zonos-v-stack", { key: 'c92966e587ea3fe988cd450b2689e2839784b0fd', spacing: 12 }, h("div", { key: 'dc6f702ef1489d007d68b125b82ecd984d5e739c', class: "zonos--flex-message" }, h("zonos-icon", { key: 'a2ea6fbb7fb36f7e446cd28c7f6e0e57c3af67bf', "aria-label": "Duty de minimis", content: ImportIcon }), h("zonos-text", { key: '04fecd291baef82d8045ecd128e34dc79d2f7eeb' }, dutyDeMinimisMessage)), h("div", { key: '2f312f15d2ed7844e7408a779eaf9f69bfc55866', class: "zonos--flex-message" }, h("zonos-icon", { key: '51e4a27c2eba54a60d8516b1824cacb918dd7ecb', "aria-label": "Tax de minimis", content: MoneyIcon }), h("zonos-text", { key: '24ecaa5087f050f994753420493f139445f93090' }, taxDeMinimisMessage)), additionalInformation && (h("div", { key: '2bdc3b49037389fc9058dfab97d02adf6ec09092', class: "zonos--flex-message" }, h("zonos-icon", { key: 'b7737b651f8df5fe555e8d26d63d3282178b225e', "aria-label": "Low value order shipping restriction", content: BagIcon }), h("zonos-text", { key: 'c9382d99555e02c03a17f58bcc7a1872cc988bd0' }, additionalInformation))))), filteredMessages.map(x => (h("zonos-custom-message", { icon: MessageIcon, message: x.message })))))), h("zonos-hello-dialog-footer", { key: '38010a811c69787c107fac817ae1cfde249454e1', appearanceSettings: this.appearanceSettings, setShowCountrySelect: value => this.setShowCountrySelect(value), setShowLanguageSelect: value => this.setShowLanguageSelect(value) }))), this.showCountrySelect && (h("div", { key: '564d7cc16fdb4871c5290578eb59f47310a73236' }, h("zonos-country-select", { key: '511418bcd30cd97458f90cbe78dbd296137ea925', handleOnClose: () => this.setShowCountrySelect(false) }))), this.showLanguageSelect && (h("div", { key: '9c215eadf43523a7ee8036a6637bf398c86c6c5c' }, h("zonos-language-select", { key: '2856beb0872a37cec0944688e4d72145a16baffb', handleOnClose: () => this.setShowLanguageSelect(false) }))))));
     }
     static get assetsDirs() { return ["assets"]; }
     static get watchers() { return {

package/dist/components/zonos-language-select2.js CHANGED Viewed

@@ -32,9 +32,9 @@ const ZonosLanguageSelect = /*@__PURE__*/ proxyCustomElement(class ZonosLanguage
     }
     render() {
         const { selectedLocale } = localizationStore;
-        return (h(Host, { key: 'c3185eaf7f8e73d1356d6cba5a7c7ba6da9db7f8', class: "zonos--elements", style: {
+        return (h(Host, { key: 'b17a55c8fe256cf1e484834700dec4ea512a0379', class: "zonos--elements", style: {
                 '--font-family': zonosStoreFontFamily(),
-            } }, h("div", { key: '59c2af417f20ee915dfddaa08c2a9f4288a5d040', class: "zonos--language-select" }, h("zonos-select-dialog-header", { key: '2cc4a3bed8e5e2c89f8ef624a9a0d2e778da9005', handleOnClose: () => this.handleOnClose(), label: translate('Select a language') }), h("div", { key: 'b0bb95a16d56e344833f3d6ec3b23ae6d5b65270', class: "zonos--language-select-content" }, languages.map(language => (h("button", { class: "zonos--language-select-button", onClick: () => this.languageSelected(language.code) }, h("zonos-text", { textColor: "gray-800" }, language.translatedLabel), language.code === selectedLocale && (h("zonos-icon", { content: GreenCheckDuotoneIcon, size: 16 })))))))));
+            } }, h("div", { key: '0d8c6f5902f3f25c2528d88dd76b625807f2bd62', class: "zonos--language-select" }, h("zonos-select-dialog-header", { key: 'c82d962040885203b20f384a56990d9515afeba6', handleOnClose: () => this.handleOnClose(), label: translate('Select a language') }), h("div", { key: 'ac4a694a903eaa38886d929350b74b0c0114b61d', class: "zonos--language-select-content" }, languages.map(language => (h("button", { class: "zonos--language-select-button", onClick: () => this.languageSelected(language.code) }, h("zonos-text", { textColor: "gray-800" }, language.translatedLabel), language.code === selectedLocale && (h("zonos-icon", { content: GreenCheckDuotoneIcon, size: 16 })))))))));
     }
     static get style() { return ZonosLanguageSelectStyle0; }
 }, [1, "zonos-language-select", {