@zonos/elements 1.3.34 → 1.3.36

package/dist/esm/zonos-country-select_3.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, d as getElement } from './index-3b46f3c3.js';
-import { a as localizationStoreUpdateSelectedCountryCode, l as localizationStore } from './cart-b9f15a63.js';
+import { a as localizationStoreUpdateSelectedCountryCode, l as localizationStore } from './cart-f29968a8.js';
 import { d as zonosStoreFontFamily } from './zonosStore-ba9e541e.js';
 import { f as formatStringWithLinks } from './formatStringWithLinks-9e819405.js';
 import { i as isDarkColor } from './isDarkColor-f8324c10.js';
@@ -1790,7 +1790,7 @@ const GreenCheckDuotoneIcon = `<svg width="16" height="16" viewBox="0 0 16 16" f
 </svg>
 `;
 
-const zonosCountrySelectCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .zonos--country-select{position:relative}:host .zonos--country-select .zonos--country-select-header{position:-webkit-sticky;position:sticky;top:0;background:var(--zonos-elements-surface-color);z-index:11}:host .zonos--country-select .zonos--country-select-input{padding:8px;border-radius:var(--zonos-elements-radius-4);border:var(--zonos-elements-border)}:host .zonos--country-select .zonos--country-select-content{padding:16px;padding-top:0px}:host .zonos--country-select .zonos--country-select-country{display:-ms-flexbox;display:flex;gap:16px;padding:8px;-ms-flex-align:center;align-items:center;border-radius:var(--zonos-elements-radius-4);cursor:pointer;width:100%;border:none;background:none}:host .zonos--country-select .zonos--country-select-country:hover{background:var(--zonos-elements-gray-100)}:host .zonos--country-select .zonos--country-select-country .zonos--country-flag{border-radius:var(--zonos-elements-radius-4);width:24px;height:18px;position:relative;overflow:hidden;-webkit-box-shadow:var(--zonos-elements-v3-shadow-medium);box-shadow:var(--zonos-elements-v3-shadow-medium);z-index:10;justify-self:center}@media (max-width: 768px){:host .zonos--country-select .zonos--country-select-country .zonos--country-flag{border-radius:var(--zonos-elements-radius-4);width:24px}}";
+const zonosCountrySelectCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .zonos--country-select{position:relative;max-height:500px;overflow-y:auto}:host .zonos--country-select .zonos--country-select-header{position:-webkit-sticky;position:sticky;top:0;background:var(--zonos-elements-surface-color);z-index:11}:host .zonos--country-select .zonos--country-select-input{padding:8px;border-radius:var(--zonos-elements-radius-4);border:var(--zonos-elements-border)}:host .zonos--country-select .zonos--country-select-content{padding:16px;padding-top:0px}:host .zonos--country-select .zonos--country-select-country{display:-ms-flexbox;display:flex;gap:16px;padding:8px;-ms-flex-align:center;align-items:center;border-radius:var(--zonos-elements-radius-4);cursor:pointer;width:100%;border:none;background:none}:host .zonos--country-select .zonos--country-select-country:hover{background:var(--zonos-elements-gray-100)}:host .zonos--country-select .zonos--country-select-country .zonos--country-flag{border-radius:var(--zonos-elements-radius-4);width:24px;height:18px;position:relative;overflow:hidden;-webkit-box-shadow:var(--zonos-elements-v3-shadow-medium);box-shadow:var(--zonos-elements-v3-shadow-medium);z-index:10;justify-self:center}@media (max-width: 768px){:host .zonos--country-select .zonos--country-select-country .zonos--country-flag{border-radius:var(--zonos-elements-radius-4);width:24px}}";
 const ZonosCountrySelectStyle0 = zonosCountrySelectCss;
 
 const ZonosCountrySelect = class {
@@ -1802,8 +1802,15 @@ const ZonosCountrySelect = class {
             this.handleOnClose();
         };
         this.handleInputChange = (event) => {
+            var _a;
             const input = event.target;
             this.inputValue = input.value;
+            // query the country list container
+            const countryListSelector = (_a = this.ele.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.zonos--country-select');
+            // scroll to top every time the input changes
+            if (countryListSelector) {
+                countryListSelector.scrollTop = 0;
+            }
         };
         this.handleOnClose = () => { };
         this.inputValue = '';
@@ -1825,9 +1832,9 @@ const ZonosCountrySelect = class {
         const filteredCountries = this.inputValue
             ? fuseObject.map(country => country.item)
             : countries.sort((a, b) => a.displayName.localeCompare(b.displayName));
-        return (h(Host, { key: '58c3b982087e7f62fa914028bfe874273e9e3fde', class: "zonos--elements", style: {
+        return (h(Host, { key: '55753f75d50712e9a27a9db9131130ce1e042c7e', class: "zonos--elements", style: {
                 '--font-family': zonosStoreFontFamily(),
-            } }, h("div", { key: '62a5b6611c4ace9413f34a91aa33c60344cb9d51', class: "zonos--country-select" }, h("zonos-v-stack", { key: 'd2133152d1e61b4cd1dfcc42fd67f44cd2585443', class: "zonos--country-select-header", spacing: 8 }, h("zonos-select-dialog-header", { key: '3fd084f5165387dc1ce567db6579599cbf420916', handleOnClose: () => this.handleOnClose(), label: "Select a country" }, h("input", { key: '176630bf445f1bb7af90fe7cec5091ea9e615e1f', class: "zonos--country-select-input", onInput: this.handleInputChange, placeholder: "Search countries", value: this.inputValue }))), h("div", { key: '50942a4c1a980bbac701e15060ed49dc9af64f73', 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: 'c96d6b99ea3d55074256b39deaab01e14c5cea0b', class: "zonos--country-select" }, h("zonos-v-stack", { key: '2e87ea4ed6a5d4b9bd0aa6764f0aa9661e7d68fd', class: "zonos--country-select-header", spacing: 8 }, h("zonos-select-dialog-header", { key: 'd8dec91571385908913825d8bad4beda4dcaa409', handleOnClose: () => this.handleOnClose(), label: "Select a country" }, h("input", { key: 'b93ab3eb035c813af752da077b493140ae0fa394', class: "zonos--country-select-input", onInput: this.handleInputChange, placeholder: "Search countries", value: this.inputValue }))), h("div", { key: 'aaaf3dbd925250d799119b5a57ca95691eeaa985', 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 getElement(this); }
 };

package/dist/esm/zonos-hello-dialog.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-3b46f3c3.js';
-import { l as localizationStore, B as currencyFormat, t as translate } from './cart-b9f15a63.js';
+import { l as localizationStore, B as currencyFormat, t as translate } from './cart-f29968a8.js';
 import { z as zonosStore } from './zonosStore-ba9e541e.js';
 import { c as classes } from './classes-0d95c529.js';
 import { f as formatStringWithLinks } from './formatStringWithLinks-9e819405.js';
@@ -213,18 +213,18 @@ const ZonosHelloDialog = class {
         const defaultMessage = formatStringWithLinks(defaultMessageStr);
         const currentPage = this.getCurrentPageEnum();
         const filteredMessages = customMessages.filter(x => x.pageName === currentPage);
-        return (h(Host, { key: 'af2c46bcc413205d644a2b94ee2ff568d3d004f2', class: "zonos--elements" }, h("div", { key: '67a563de9e702e370d057ee3cc45bc0c14feedc5', "aria-hidden": "true", class: classes([
+        return (h(Host, { key: 'af2c46bcc413205d644a2b94ee2ff568d3d004f2', class: "zonos--elements" }, h("div", { key: 'e74b871d52d734ca9ad772d8ae1c5bef1aaf06f9', 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: '412a8d2f4c01e4ff216feb92a979be5987bcd8c7' }, h("div", { key: 'b2921acfc77c6a402a14256a6f1c28607f6533e7', class: "zonos--hello-dialog-content" }, h("zonos-button", { key: 'aa623c0533a5f852dab7f0f98d6dc26f62ef899a', 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: '4fdac9331a5b2506a5ca1c7c1b6bfecf822bfcd9', spacing: 24 }, h("zonos-country-flag", { key: '57afef45e0bebe9bdfa715306f6ec2c30aca8dc1', class: "zonos--hello-country-flag", countryCode: selectedCountryCode }), h("zonos-v-stack", { key: '954b970c82fd631efadbd9c916e8bad78f0e1321', class: "zonos--hello-dialog-header", spacing: 4 }, h("zonos-text", { key: 'cde98a9636e6150d6cab009970938a0cf61bc05a', type: "boldSubheader" }, welcomeMessage), h("zonos-text", { key: 'b63fc79317f23854737c1f2dd2cbde38f3841f2a', innerHTML: defaultMessage, textColor: "gray-800" })), h("zonos-v-stack", { key: 'e115a03222d2271b358c3f1ae3feb938bafcdbef', spacing: 8 }, this.restrictedItems.map(item => {
+            ]), inert: !this.isOpen, ref: el => el && (this.dialogRef = el) }, !this.showCountrySelect && !this.showLanguageSelect && (h("div", { key: 'd973d051143ab56e1af29b7ee812f1e5405b7768' }, h("div", { key: '1539bbc35aebccc9748e2d3b77b1717bd2e5dec5', class: "zonos--hello-dialog-content" }, h("zonos-button", { key: '675ff7bb8fdf8373c1aa21200ccc42ff9b585355', 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: 'c82a41c292facb00fd1a48ce69920b1de47d3f09', spacing: 24 }, h("zonos-country-flag", { key: '6b083cf77226e3766ad50a812c1201809593f3d6', class: "zonos--hello-country-flag", countryCode: selectedCountryCode }), h("zonos-v-stack", { key: 'f0ab4ca66f22b0448edff37fc730e72790b83de8', class: "zonos--hello-dialog-header", spacing: 4 }, h("zonos-text", { key: '574f22410d18fbeea3ac3fe22a735a2d858b5c9e', type: "boldSubheader" }, welcomeMessage), h("zonos-text", { key: '35f718094fcbd34d8e8ae9ec46fd0429cfcd1104', innerHTML: defaultMessage, textColor: "gray-800" })), h("zonos-v-stack", { key: 'e4bd687a84f1d48d0a20564a4ac9b9c1a24b3850', 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: '6f5ef13c8ce1171b99c148f43f491ced8f29cd57', spacing: "12px" }, h("zonos-v-stack", { key: '816a373a6dcf69976279af51f09d136f18c6b4a8', spacing: 12 }, h("div", { key: '51fc31937cb4885c7a98ee5fbc0755a00158f172', class: "zonos--flex-message" }, h("zonos-icon", { key: 'bc659d649b3a7f046225270870e7ae31597027f4', "aria-label": "Duty de minimis", content: ImportIcon }), h("zonos-text", { key: 'e63ce2eb6f381718ca26962c7429f266bf8cf8d9' }, dutyDeMinimisMessage)), h("div", { key: '6f49eac81be52709ad8f35c04cccd7d2fec03b7a', class: "zonos--flex-message" }, h("zonos-icon", { key: 'd95f29c3c42480c89a34e831740cfdbb3d64c058', "aria-label": "Tax de minimis", content: MoneyIcon }), h("zonos-text", { key: 'c226092fef030070af3af1d45debab989fb4f1b7' }, taxDeMinimisMessage)), additionalInformation === null || additionalInformation === void 0 ? void 0 :
-            additionalInformation.map(info => (h("div", { class: "zonos--flex-message" }, h("zonos-icon", { "aria-label": "Additional information for buying goods from selected country", content: BagIcon }), h("zonos-text", { innerHTML: info })))))), filteredMessages.map(x => (h("zonos-custom-message", { icon: MessageIcon, message: x.message })))))), h("zonos-hello-dialog-footer", { key: '32739e817940a937b59380197934ced91f2afc50', appearanceSettings: this.appearanceSettings, setShowCountrySelect: value => this.setShowCountrySelect(value), setShowLanguageSelect: value => this.setShowLanguageSelect(value) }))), this.showCountrySelect && (h("div", { key: 'be58e393680370837ae35d5d4f85f77cf9620db2' }, h("zonos-country-select", { key: 'bc5c7e086513a44f817e5769acf2ca382b01fcc4', handleOnClose: () => this.setShowCountrySelect(false) }))), this.showLanguageSelect && (h("div", { key: '7cbee089b9661602bb23e5e2821030d04891f18a' }, h("zonos-language-select", { key: '55d654b2b339cfd83e3fe9814d914a382a891af3', handleOnClose: () => this.setShowLanguageSelect(false) }))))));
+        }), h("zonos-card", { key: '53fa284d1d87505e550bb893a895e944894cd8b6', spacing: "12px" }, h("zonos-v-stack", { key: 'ee8ecb870af875c1bbc49be88464094753d96b26', spacing: 12 }, h("div", { key: '9bb07220319b2635d66722c79a81c77c049e2aa0', class: "zonos--flex-message" }, h("zonos-icon", { key: 'cf345dace81622f3fd240a1538f25fce855d2ae2', "aria-label": "Duty de minimis", content: ImportIcon }), h("zonos-text", { key: '4a047bc63a8e2a1f88203241b927ac3f3f05a398' }, dutyDeMinimisMessage)), h("div", { key: 'af75e4d21ae1189d015376bfed3caf9156788ceb', class: "zonos--flex-message" }, h("zonos-icon", { key: '356fbbe36379ab8513822be08f8b4f3af4f8baf5', "aria-label": "Tax de minimis", content: MoneyIcon }), h("zonos-text", { key: '5b8fb3f1622bb49bbed21e0a81d6725a5825e931' }, taxDeMinimisMessage)), additionalInformation === null || additionalInformation === void 0 ? void 0 :
+            additionalInformation.map(info => (h("div", { class: "zonos--flex-message" }, h("zonos-icon", { "aria-label": "Additional information for buying goods from selected country", content: BagIcon }), h("zonos-text", { innerHTML: info })))))), filteredMessages.map(x => (h("zonos-custom-message", { icon: MessageIcon, message: x.message })))))), h("zonos-hello-dialog-footer", { key: '362873c8bac81efc80e44fae1d74a0bffae5e605', appearanceSettings: this.appearanceSettings, setShowCountrySelect: value => this.setShowCountrySelect(value), setShowLanguageSelect: value => this.setShowLanguageSelect(value) }))), this.showCountrySelect && (h("div", { key: '86d0d738e77d51666d3f63288aa1e954d539bb06' }, h("zonos-country-select", { key: '98766f096f97b249f0b4b3ebe053474de4ae498a', handleOnClose: () => this.setShowCountrySelect(false) }))), this.showLanguageSelect && (h("div", { key: '3268e1c0a9f7300b0e997ef238a4d95ec9d4f894' }, h("zonos-language-select", { key: '1b6d9dd2872332b2eba343ffd8798b1e87c71c2a', handleOnClose: () => this.setShowLanguageSelect(false) }))))));
     }
     static get assetsDirs() { return ["assets"]; }
     static get watchers() { return {

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

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-3b46f3c3.js';
 import { _ as _root, e as _baseGetTag, i as isObjectLike_1, f as isObject_1, z as zonosStore, g as getZonosStoreTheme, m as mergeConfig } from './zonosStore-ba9e541e.js';
-import { r as handleFetch, l as localizationStore, u as isValidSelector, t as translate, w as getZCountryUrlParam, x as setZCountryUrlParam, y as currencyDisplay, z as currencyConvertAndFormat, A as currencyConvert, B as currencyFormat } from './cart-b9f15a63.js';
+import { r as handleFetch, l as localizationStore, u as isValidSelector, t as translate, w as getZCountryUrlParam, x as setZCountryUrlParam, y as currencyDisplay, z as currencyConvertAndFormat, A as currencyConvert, B as currencyFormat } from './cart-f29968a8.js';
 import { c as classes } from './classes-0d95c529.js';
 import { a as logError, l as log } from './logError-c456c092.js';
 import { g as getHasMoreSpaceOnRight } from './getHasMoreSpaceOnRight-70eb913a.js';

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

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host } from './index-3b46f3c3.js';
-import { H as localizationStoreUpdateSelectedLocale, t as translate, l as localizationStore } from './cart-b9f15a63.js';
+import { H as localizationStoreUpdateSelectedLocale, t as translate, l as localizationStore } from './cart-f29968a8.js';
 import { d as zonosStoreFontFamily } from './zonosStore-ba9e541e.js';
 import { l as languages } from './ILanguage-cd6acb72.js';
 import './logError-c456c092.js';

package/dist/esm/zonos-notification_2.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, h, H as Host, d as getElement } from './index-3b46f3c3.js';
 import { d as zonosStoreFontFamily } from './zonosStore-ba9e541e.js';
 import { c as classes } from './classes-0d95c529.js';
-import { h as stripeStore } from './cart-b9f15a63.js';
+import { h as stripeStore } from './cart-f29968a8.js';
 import { a as logError } from './logError-c456c092.js';
 import './isDarkColor-f8324c10.js';
 import './getBorderRadius-947c24de.js';