@zonos/elements 1.3.34 → 1.3.35

package/dist/cjs/{cart-42cc98d9.js → cart-401b6d32.js}

@@ -7142,6 +7142,25 @@ const localizationStoreUpdateSelectedLocale = (newSelectedLocale) => {
     void updateCheckoutSessionLanguage();
 };
 
+/**
+ * Extract value from translated object
+ */
+const getTranslatedAddress = ({ currentAddress, translatedAddress, }) => {
+    var _a, _b, _c, _d, _e, _f;
+    const { city, country, line1, line2, postal_code, state } = currentAddress.value.address;
+    const name = currentAddress.value.name ||
+        [currentAddress.value.firstName, currentAddress.value.lastName].join(' ');
+    return {
+        city: ((_a = translatedAddress.city) === null || _a === void 0 ? void 0 : _a[city]) || city,
+        country,
+        line1: ((_b = translatedAddress.line1) === null || _b === void 0 ? void 0 : _b[line1]) || line1,
+        line2: ((_c = translatedAddress.line2) === null || _c === void 0 ? void 0 : _c[line2 || '']) || line2 || '',
+        name: ((_d = translatedAddress.name) === null || _d === void 0 ? void 0 : _d[name]) || name,
+        phone: currentAddress.value.phone || '',
+        postal_code: ((_e = translatedAddress.postal_code) === null || _e === void 0 ? void 0 : _e[postal_code]) || postal_code,
+        state: ((_f = translatedAddress.state) === null || _f === void 0 ? void 0 : _f[state]) || state,
+    };
+};
 const prepCalculateLandedCost = () => {
     // maybe we don't need email now for prefetch the landed cost
     const stripeLinkData = stripeStore.stripeLinkEventData;
@@ -7152,39 +7171,52 @@ const prepCalculateLandedCost = () => {
     if (!(stripeAddressData === null || stripeAddressData === void 0 ? void 0 : stripeAddressData.complete) || !(stripeBillingAddressData === null || stripeBillingAddressData === void 0 ? void 0 : stripeBillingAddressData.complete)) {
         throw new Error('Missing stripe address data');
     }
+    // Attempt to get translated address if available
+    const translatedShippingAddress = getTranslatedAddress({
+        currentAddress: stripeAddressData,
+        translatedAddress: stripeStore.translatedAddress.address,
+    });
+    const shippingFirstName = translatedShippingAddress.name.split(' ')[0] || '';
+    const shippingLastName = translatedShippingAddress.name.split(' ').splice(1).join(' ') || '';
+    const translatedBillingAddress = getTranslatedAddress({
+        currentAddress: stripeBillingAddressData,
+        translatedAddress: stripeStore.translatedAddress.address,
+    });
+    const billingFirstName = translatedBillingAddress.name.split(' ')[0] || '';
+    const billingLastName = translatedBillingAddress.name.split(' ').splice(1).join(' ') || '';
     return {
         billingAddress: {
-            addressLine1: stripeBillingAddressData.value.address.line1,
-            addressLine2: stripeBillingAddressData.value.address.line2 || '',
-            city: stripeBillingAddressData.value.address.city,
-            country: stripeBillingAddressData.value.address.country,
-            postalCode: stripeBillingAddressData.value.address.postal_code,
-            state: stripeBillingAddressData.value.address.state,
+            addressLine1: translatedBillingAddress.line1,
+            addressLine2: translatedBillingAddress.line2 || '',
+            city: translatedBillingAddress.city,
+            country: translatedBillingAddress.country,
+            postalCode: translatedBillingAddress.postal_code,
+            state: translatedBillingAddress.state,
         },
         billingContact: {
             // firstName and lastName should be valid now since stripe only mark
             // the address as complete when both fields are filled.
-            firstName: stripeBillingAddressData.value.firstName || '',
-            lastName: stripeBillingAddressData.value.lastName || '',
-            phone: stripeBillingAddressData.value.phone || '',
+            firstName: billingFirstName,
+            lastName: billingLastName,
+            phone: translatedBillingAddress.phone,
         },
         checkoutSessionId: cartStore.checkoutSessionId || '',
         contact: {
-            email: (stripeLinkData === null || stripeLinkData === void 0 ? void 0 : stripeLinkData.value.email) || '',
+            email: stripeLinkData === null || stripeLinkData === void 0 ? void 0 : stripeLinkData.value.email,
             // firstName and lastName should be valid now since stripe only mark
             // the address as complete when both fields are filled.
-            firstName: stripeAddressData.value.firstName || '',
-            lastName: stripeAddressData.value.lastName || '',
-            phone: stripeAddressData.value.phone || '',
+            firstName: shippingFirstName,
+            lastName: shippingLastName,
+            phone: translatedShippingAddress.phone,
         },
         items: cartStore.items,
         shippingAddress: {
-            addressLine1: stripeAddressData.value.address.line1,
-            addressLine2: stripeAddressData.value.address.line2 || '',
-            city: stripeAddressData.value.address.city,
-            country: stripeAddressData.value.address.country,
-            postalCode: stripeAddressData.value.address.postal_code,
-            state: stripeAddressData.value.address.state,
+            addressLine1: translatedShippingAddress.line1,
+            addressLine2: translatedShippingAddress.line2,
+            city: translatedShippingAddress.city,
+            country: translatedShippingAddress.country,
+            postalCode: translatedShippingAddress.postal_code,
+            state: translatedShippingAddress.state,
         },
     };
 };

package/dist/cjs/index.cjs.js

@@ -249,9 +249,9 @@ const zonosLoadUrl = (() => {
     }
     return null;
 })();
-const ZONOS_URL = "https://v1.3.34.js.zonos.com";
-const JS_DELIVR_ZONOS_URL = zonosLoadUrl || "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.34";
-const UNPKG_ZONOS_URL = "https://unpkg.com/@zonos/elements@1.3.34";
+const ZONOS_URL = "https://v1.3.35.js.zonos.com";
+const JS_DELIVR_ZONOS_URL = zonosLoadUrl || "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.35";
+const UNPKG_ZONOS_URL = "https://unpkg.com/@zonos/elements@1.3.35";
 const MAIN_LOAD_CDN_TYPE = 'jsdelivr';
 const INTER_FONT_URL = 'https://rsms.me';
 const GOOGLE_FONT_URL = 'https://fonts.googleapis.com';
@@ -271,7 +271,7 @@ Zonos.isBigCommerce = false;
  */
 Zonos.isNpm = true;
 Zonos.zonosQaUrl = null;
-Zonos.version = `v${"1.3.34"}`;
+Zonos.version = `v${"1.3.35"}`;
 Zonos.modeAlerted = false;
 Zonos.tempCartData = null;
 Zonos.getCurrentTimestamp = () => new Date().getTime();

package/dist/cjs/{submitGtag-09f2e437.js → submitGtag-bc6af393.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const cart = require('./cart-42cc98d9.js');
+const cart = require('./cart-401b6d32.js');
 const zonosStore = require('./zonosStore-4c6c85da.js');
 const logError = require('./logError-4e2f2020.js');
 

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b071017b.js');
-const cart = require('./cart-42cc98d9.js');
+const cart = require('./cart-401b6d32.js');
 const isCheckoutMobile = require('./isCheckoutMobile-f491ca7c.js');
 const logError = require('./logError-4e2f2020.js');
 const containsNonLatinChars = require('./containsNonLatinChars-2be5129b.js');
@@ -212,16 +212,17 @@ const ZonosAddressForm = class {
     render() {
         const { city, country, line1, line2, name, phone, postal_code, state } = this.localAddress;
         const firstName = name.split(' ')[0] || '';
-        const lastName = name.split(' ')[1] || '';
-        return (index.h(index.Host, { key: '9c1ee87200d1f90e9dfac58c49aabba1777373a9', class: "zonos--address-form zonos--elements" }, index.h("div", { key: 'eec3416268ff2324fd751408552705086905423d', class: "zonos--title" }, index.h("zonos-text", { key: 'a4c254f78420dcfc712e1a83b20dd3ac9e64c460', textColor: "gray-700", type: "smallHeader" }, this.addressType === 'shipping'
+        // get the rest of the name if it exists
+        const lastName = name.split(' ').slice(1).join(' ') || '';
+        return (index.h(index.Host, { key: '8b578737e33203a23563be7e9be0778deec99bbf', class: "zonos--address-form zonos--elements" }, index.h("div", { key: '793675a1348547bf3f781788956befe325191011', class: "zonos--title" }, index.h("zonos-text", { key: '13de35cb0a7c98a48342e3fb86ae3ade9f5b88d9', textColor: "gray-700", type: "smallHeader" }, this.addressType === 'shipping'
             ? cart.translate('Shipping')
-            : cart.translate('Billing'))), index.h("div", { key: 'b8109545d282fb8c06a2e791c30088018d6ffec0', class: "zonos--address-group" }, index.h("div", { key: '833a395984cd75242e5d97697fd6566f11932d1b', class: "zonos--contact" }, index.h("zonos-text", { key: 'e60f574e95162aabf6465b878fc9b16c708e8029', type: "label" }, cart.translate('Contact')), index.h("zonos-input", { key: '24cd24a362a1bbc76d0c91718c48ae32baa20ae6', class: "zonos--form-email", inputLabel: cart.translate('Email'), inputValue: this.currentAddress.email, isDisabled: true }), index.h("div", { key: '84e64ef44eb3b39ac7ab542e07d7a52a95377cae', class: "zonos--name zonos--address-row" }, index.h("zonos-input", { key: '26621aca0d57a7fee743874b8d11af5f58c91b69', class: "zonos--form-first-name", inputLabel: cart.translate('First name'), inputValue: firstName, isError: containsNonLatinChars.isTextContainsNonLatinChars(firstName), onInputChange: e => this.onInputChange({
+            : cart.translate('Billing'))), index.h("div", { key: '2c5de5b5283fb99ee5f8b61d7a217177986fc2db', class: "zonos--address-group" }, index.h("div", { key: '23bf3c893071000d5995a5f175867bab11929193', class: "zonos--contact" }, index.h("zonos-text", { key: '7cdfe2a84ebad89ba5b16498d75def99cf392384', type: "label" }, cart.translate('Contact')), index.h("zonos-input", { key: '1c39c38767fd306c5eb1164cdc989b8291209cf0', class: "zonos--form-email", inputLabel: cart.translate('Email'), inputValue: this.currentAddress.email, isDisabled: true }), index.h("div", { key: 'cbdf61217125e22b1a6cec9a340ef0aca2c75670', class: "zonos--name zonos--address-row" }, index.h("zonos-input", { key: '360c99e7b2c6caa64580d5768b5bb53368927275', class: "zonos--form-first-name", inputLabel: cart.translate('First name'), inputValue: firstName, isError: containsNonLatinChars.isTextContainsNonLatinChars(firstName), onInputChange: e => this.onInputChange({
                 key: 'name',
                 value: `${e.detail} ${lastName}`,
-            }) }), index.h("zonos-input", { key: '01e3e5038b4a4311dd5874a1213f936451dc300d', class: "zonos--form-last-name", inputLabel: cart.translate('Last name'), inputValue: lastName, isError: containsNonLatinChars.isTextContainsNonLatinChars(lastName), onInputChange: e => this.onInputChange({
+            }) }), index.h("zonos-input", { key: '8ce5fa5c15c6f7928339ea10009ce0e68954a91f', class: "zonos--form-last-name", inputLabel: cart.translate('Last name'), inputValue: lastName, isError: containsNonLatinChars.isTextContainsNonLatinChars(lastName), onInputChange: e => this.onInputChange({
                 key: 'name',
                 value: `${firstName} ${e.detail}`,
-            }) }))), index.h("div", { key: 'eb42dece28082ff16a453110b3208de5b44b9fdb', class: "zonos--address" }, index.h("zonos-text", { key: '3557122c716533be7b36a8bd395ea616a7061665', type: "label" }, cart.translate('Address')), index.h("zonos-input", { key: 'bcc7d84d530f2f3a10537117eb6ef143df7cc8e2', class: "zonos--form-country", inputLabel: cart.translate('Country'), inputValue: country, isDisabled: true }), index.h("zonos-input", { key: '6ce78e25151a129b69b501cf768604134a395e85', class: "zonos--form-line1", inputLabel: cart.translate('Address line 1'), inputValue: line1, isError: containsNonLatinChars.isTextContainsNonLatinChars(line1), onInputChange: e => this.onInputChange({ key: 'line1', value: e.detail }) }), index.h("zonos-input", { key: '6f7a18010e2d8131327154a31ba58544df56768c', class: "zonos--form-line2", inputLabel: cart.translate('Address line 2'), inputValue: line2, isError: containsNonLatinChars.isTextContainsNonLatinChars(line2), onInputChange: e => this.onInputChange({ key: 'line2', value: e.detail }) }), index.h("div", { key: '48afbf7a3cbd26fddfea4f2799005a51b1c3d3c6', class: "zonos--address-row" }, index.h("zonos-input", { key: '6decf8c430d8d25b2c555b110009da74e0ac9e5f', class: "zonos--form-city", inputLabel: cart.translate('City'), inputValue: city, isError: containsNonLatinChars.isTextContainsNonLatinChars(city), onInputChange: e => this.onInputChange({ key: 'city', value: e.detail }) }), index.h("zonos-input", { key: '065e1be213d3cfec7749ab32890f96b0b484a25a', class: "zonos--form-state", inputLabel: cart.translate('State/Province'), inputValue: state, isError: containsNonLatinChars.isTextContainsNonLatinChars(state), onInputChange: e => this.onInputChange({ key: 'state', value: e.detail }) })), index.h("zonos-input", { key: 'a69244bf84c9fd007c9ad4aad2b6cc6d44420775', class: "zonos--form-postal-code", inputLabel: cart.translate('Postal code'), inputValue: postal_code, isError: containsNonLatinChars.isTextContainsNonLatinChars(postal_code), onInputChange: e => this.onInputChange({ key: 'postal_code', value: e.detail }) }), index.h("zonos-input", { key: '0bcc89de1ecc4aae8a69d74eff42dfd117ada40b', class: "zonos--form-phone", inputLabel: cart.translate('Phone number'), inputValue: phone, onInputChange: e => this.onInputChange({ key: 'phone', value: e.detail }) })))));
+            }) }))), index.h("div", { key: '7b4fa2d3baa6cb257e7688e5ba6777123898b3fd', class: "zonos--address" }, index.h("zonos-text", { key: '9d5782331b2642755a755aeb7f98c9f4d87f9a20', type: "label" }, cart.translate('Address')), index.h("zonos-input", { key: 'a622025924ca86bdbf1d3c04b79e6dee172b4c42', class: "zonos--form-country", inputLabel: cart.translate('Country'), inputValue: country, isDisabled: true }), index.h("zonos-input", { key: 'f99b3a74db09ab5730878e80705b9aeac76bf800', class: "zonos--form-line1", inputLabel: cart.translate('Address line 1'), inputValue: line1, isError: containsNonLatinChars.isTextContainsNonLatinChars(line1), onInputChange: e => this.onInputChange({ key: 'line1', value: e.detail }) }), index.h("zonos-input", { key: '5d16aefa45a78045c87d166aaaec0255606e455e', class: "zonos--form-line2", inputLabel: cart.translate('Address line 2'), inputValue: line2, isError: containsNonLatinChars.isTextContainsNonLatinChars(line2), onInputChange: e => this.onInputChange({ key: 'line2', value: e.detail }) }), index.h("div", { key: 'dc166be9381142835d72e731cb38a718522a068a', class: "zonos--address-row" }, index.h("zonos-input", { key: '4f1a98f9d10ce0cff3ef18a3037a12382552b31d', class: "zonos--form-city", inputLabel: cart.translate('City'), inputValue: city, isError: containsNonLatinChars.isTextContainsNonLatinChars(city), onInputChange: e => this.onInputChange({ key: 'city', value: e.detail }) }), index.h("zonos-input", { key: 'd4f97900b5fe2e1619950a52d1d1f716a8bc19ff', class: "zonos--form-state", inputLabel: cart.translate('State/Province'), inputValue: state, isError: containsNonLatinChars.isTextContainsNonLatinChars(state), onInputChange: e => this.onInputChange({ key: 'state', value: e.detail }) })), index.h("zonos-input", { key: 'cf1eb0ca5cd15c8412a2e1246aaf2e39361dc733', class: "zonos--form-postal-code", inputLabel: cart.translate('Postal code'), inputValue: postal_code, isError: containsNonLatinChars.isTextContainsNonLatinChars(postal_code), onInputChange: e => this.onInputChange({ key: 'postal_code', value: e.detail }) }), index.h("zonos-input", { key: '7421c82847eded6bdbcce49ef8196124d8e50c1d', class: "zonos--form-phone", inputLabel: cart.translate('Phone number'), inputValue: phone, onInputChange: e => this.onInputChange({ key: 'phone', value: e.detail }) })))));
     }
     static get watchers() { return {
         "translatedAddress": ["watchCurrentAddress"]
@@ -235,13 +236,13 @@ const ZonosAddressUpdateDialogStyle0 = zonosAddressUpdateDialogCss;
 const ZonosAddressUpdateDialog = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.closeDialog = index.createEvent(this, "closeDialog", 7);
+        this.closeUpdateDialog = index.createEvent(this, "closeUpdateDialog", 7);
         this.continueClicked = index.createEvent(this, "continueClicked", 7);
         /**
          * handler for close button click
          */
-        this.closeDialogHandler = () => {
-            this.closeDialog.emit();
+        this.closeUpdateDialogHandler = () => {
+            this.closeUpdateDialog.emit();
         };
         /**
          * Extract value from translated object
@@ -371,24 +372,24 @@ const ZonosAddressUpdateDialog = class {
             : this.submitBtnType || 'standard';
         const billing = this.billingAddress;
         const shipping = this.shippingAddress;
-        return (index.h(index.Host, { key: '03535edacb348258592641baa349e9dcf14bf78c', class: classes.classes([
+        return (index.h(index.Host, { key: '655845cef04f4af526b1a1c4e49243c4f2b4c7f6', class: classes.classes([
                 'zonos--address-update-dialog zonos--elements',
                 this.isMobile && 'mobile',
-            ]) }, index.h("zonos-dialog", { key: 'c16871425dffe955d422ffa5b9aee1ece0da2890', isLoading: this.dialogLoading, mobile: this.isMobile, noBodyPadding: true, noBorder: true, noClickOutside: true, noCloseButton: true, onCloseDialog: () => this.closeDialog.emit(), open: this.dialogOpen, width: "568px" }, index.h("div", { key: 'e4fad501f7cfedc5783774d8b1bf785d6947d3c8', class: "zonos--body" }, index.h("div", { key: '973e7a8097b8c8f60e47e6ad9d8311a64a5a6ff0', class: "zonos--dialog-header" }, index.h("div", { key: '89c82b6ff3723056d161560da22bd16a992afee7', class: "zonos--dialog-title" }, index.h("zonos-text", { key: 'bf92ef0b40ea67a492164fedb95dd68b7d023e85', type: "title" }, cart.translate('Update your address')), index.h("zonos-button", { key: '4e7a1905c976cec396db5c34f633b383bba0d55a', class: "zonos--close-button", icon: index.h("zonos-icon", { "aria-label": "Close checkout dialog", content: RemoveIcon$1.RemoveIcon }), noBackground: true, onClick: () => this.closeDialogHandler() })), index.h("zonos-text", { key: '47b42d8cc14c4757e3fc9f2f43eafbd8d9e9df38' }, cart.translate('To ensure delivery all address details must be in Latin characters.'))), index.h("div", { key: '28d9804f0a18f143ce541c2c511cbfa21a2a416f', class: "zonos--group" }, index.h("zonos-text", { key: '43ec5a9fc8594d065b256952ca8e9392fba03839', class: "zonos--what-you-entered", type: "semiBoldLabel" }, cart.translate('What you entered')), index.h("div", { key: 'b7eb7781ce6aefe20f89b4d5fba190f0102eb5d1', class: "zonos--address-display-group" }, index.h("zonos-address-display", { key: '152c53176a46575677723ca47386e484c659927a', addressType: "shipping", currentAddress: shipping }), billing && (index.h("zonos-address-display", { key: '6c7ac2b49d121c26ce45f09a1eac9ef456d45910', addressType: "billing", currentAddress: billing }))), index.h("div", { key: '2bda98bb0ac9bafcb009ff36fb97a9fc62ce7e2d', class: "zonos--address-form-section" }, index.h("zonos-text", { key: '87d3380072a049ccde71ba1b752aedd36830348b', type: "semiBoldLabel" }, cart.translate('Translated address')), index.h("zonos-address-form", { key: '2cb36251c6549da05e272183b2c37478b4166fea', addressType: "shipping", class: "zonos--shipping-address-form", currentAddress: shipping, onAddressChange: e => {
+            ]) }, index.h("zonos-dialog", { key: 'eab429bb78ce6f05ba463d8748d7edd5499402fa', isLoading: this.dialogLoading, mobile: this.isMobile, noBodyPadding: true, noBorder: true, noClickOutside: true, noCloseButton: true, onCloseDialog: () => this.closeUpdateDialog.emit(), open: this.dialogOpen, width: "568px" }, index.h("div", { key: '08f0400e62addfcaffd91bf5200999d29bbd2da9', class: "zonos--body" }, index.h("div", { key: '8699df5e2f823e19066fbb552ba2a66c127c05e9', class: "zonos--dialog-header" }, index.h("div", { key: '92e0ff932dcdb0e5b59ea34b688d1ef8e31bfeb3', class: "zonos--dialog-title" }, index.h("zonos-text", { key: 'aaac3375526bddb319ce7c8f49bde30da7210264', type: "title" }, cart.translate('Update your address')), index.h("zonos-button", { key: '66abf7b74045e68e84e631298504236d32ca9c4e', class: "zonos--close-button", icon: index.h("zonos-icon", { "aria-label": "Close checkout dialog", content: RemoveIcon$1.RemoveIcon }), noBackground: true, onClick: () => this.closeUpdateDialogHandler() })), index.h("zonos-text", { key: 'ffb3d8f169867d5f6dff269e1becd99c98c5a7da' }, cart.translate('To ensure delivery all address details must be in Latin characters.'))), index.h("div", { key: '2cb61f06ce174e2317870decfdd337c67c5cf128', class: "zonos--group" }, index.h("zonos-text", { key: 'a616c540984120b468e52bccfb380ea3974ced22', class: "zonos--what-you-entered", type: "semiBoldLabel" }, cart.translate('What you entered')), index.h("div", { key: '6ac8f9c14472370c501af1b0d50bd8f8746b7694', class: "zonos--address-display-group" }, index.h("zonos-address-display", { key: 'ea2c67a7bba51c99f80be968e448beeffcf1f863', addressType: "shipping", currentAddress: shipping }), billing && (index.h("zonos-address-display", { key: '7ea1683dc04a292810e04ed6550d86086f25186f', addressType: "billing", currentAddress: billing }))), index.h("div", { key: '4d1cd9096943518b8b4e267608a5e1542befb6a9', class: "zonos--address-form-section" }, index.h("zonos-text", { key: 'e4184a2cc618d26d43979fa8cfe06070cf8b5af8', type: "semiBoldLabel" }, cart.translate('Translated address')), index.h("zonos-address-form", { key: 'c55d9d3c658565ceb7c7b879f444e3937b9f7ad6', addressType: "shipping", class: "zonos--shipping-address-form", currentAddress: shipping, onAddressChange: e => {
                 const address = e.detail;
                 this.translatedShippingAddressState =
                     this.buildTranslateAddressState({
                         currentAddress: shipping,
                         translatedAddress: address,
                     });
-            }, translatedAddress: this.translatedShippingAddressState }), billing && (index.h("zonos-address-form", { key: '9bf5ebd6fb08851716a72c855451bfeb3ee0ed68', addressType: "billing", class: "zonos--billing-address-form", currentAddress: billing, onAddressChange: e => {
+            }, translatedAddress: this.translatedShippingAddressState }), billing && (index.h("zonos-address-form", { key: 'c3facc295b1322bb00baa6081f343dcea4f10777', addressType: "billing", class: "zonos--billing-address-form", currentAddress: billing, onAddressChange: e => {
                 const address = e.detail;
                 this.translatedBillingAddressState =
                     this.buildTranslateAddressState({
                         currentAddress: billing,
                         translatedAddress: address,
                     });
-            }, translatedAddress: this.translatedBillingAddressState })))), index.h("div", { key: '621df9c8919973b37c62aca5727bde3635086a6b', class: "zonos--group-btn" }, index.h("div", { key: '95e9fd31418abc8e89ceef24af7cc251ee45ac93', class: "zonos--button-wrapper" }, index.h("zonos-button", { key: 'bef31fc81e7cc0f2b3f7ab875a29978b07865b6a', class: "zonos--cancel-btn", onClick: () => this.closeDialogHandler(), variant: "subtle" }, cart.translate('Cancel')), index.h("zonos-button", { key: '9d183153541766b421c3420681c1159ffa599682', backgroundColor: this.submitBtnColor, class: "zonos--update-btn", loading: this.continueLoading, onClick: () => this.continueClickHandler(), size: "sm", variant: submitBtnType }, cart.translate('Update address'))))))));
+            }, translatedAddress: this.translatedBillingAddressState })))), index.h("div", { key: '1c89c9604ba0dece40275fcfac97e7f93706b430', class: "zonos--group-btn" }, index.h("div", { key: 'e47d393940b094b4e123864e4070daa87f0616f0', class: "zonos--button-wrapper" }, index.h("zonos-button", { key: '216b7afe268a4acd6bb8a76b7f5a32dc09bdd4f6', class: "zonos--cancel-btn", onClick: () => this.closeUpdateDialogHandler(), variant: "subtle" }, cart.translate('Cancel')), index.h("zonos-button", { key: 'acbacb92cedb325b46843d8f3aff13f4e7c86ab5', backgroundColor: this.submitBtnColor, class: "zonos--update-btn", loading: this.continueLoading, onClick: () => this.continueClickHandler(), size: "sm", variant: submitBtnType }, cart.translate('Update address'))))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -520,7 +521,7 @@ const ZonosDialogStyle0 = zonosDialogCss;
 const ZonosDialog = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.closeDialog = index.createEvent(this, "closeDialog", 7);
+        this.closeDialog = index.createEvent(this, "closeDialog", 3);
         this.isMobileMode = () => {
             return this.mobile || window.innerWidth <= 768;
         };
@@ -573,7 +574,7 @@ const ZonosDialog = class {
         const borderStyle = getBorderRadius.getBorderRadius({
             overrideBorderStyle: this.borderStyle,
         });
-        return (index.h(index.Host, { key: '9478fd5dd572bc1a677146025485b74321700fba', class: classes.classes([
+        return (index.h(index.Host, { key: '018771d0e01311ae520abcf33fbd64316794b202', class: classes.classes([
                 'zonos--elements',
                 this.open && 'open',
                 this.isLoading && 'is-loading',
@@ -585,10 +586,10 @@ const ZonosDialog = class {
                 '--height': this.height || 'initial',
                 '--min-height': this.minHeight || '500px',
                 '--width': this.width,
-            } }, index.h("div", { key: '4bc8f62202bbae238d07536f3234bdc00c6d689f', class: "zonos--backdrop" }), index.h("div", { key: 'da80cf2a9b0a19e4e42062a57fed91ecfe6c0bcf', "aria-hidden": "true", class: "zonos--dialog-layout", onClick: this.clickOutsideDialogHandler }, index.h("div", { key: '7bbaacf6fbb5ff70db62246254f007006146324e', class: "zonos--dialog" }, this.isLoading && (index.h("div", { key: 'c65e9205d105456072b4c3c7549dce937dd7f8ec', class: "zonos--loading" }, index.h("zonos-spinner", { key: 'ac3667841a42f0ae55831a449c07bdfadc976971', size: 30 }))), (this.headerText || !this.noCloseButton) && (index.h("div", { key: '9e2c9ec2c4a9be64169f2f6b6473bc16516fbff1', class: "zonos--header" }, this.headerText && (index.h("h3", { key: '0b2086b13d7cfc14901527afbb087c40eb76895d', class: "zonos--header-text" }, this.headerText)), !this.noCloseButton && (index.h("zonos-button", { key: '2d2b55e65e965071f6422665eaa8be7991450a93', class: "zonos--close-button", icon: index.h("zonos-icon", { "aria-label": "Close dialog", content: RemoveIcon }), noBackground: true, onClick: this.closeButtonHandler, variant: "subtle" })))), index.h("div", { key: 'aedb5b3b307a5a04f9b806c927679d0e0c0de711', class: classes.classes([
+            } }, index.h("div", { key: 'a86c9f8465054fde894bbdd71149e59d97e8cbcf', class: "zonos--backdrop" }), index.h("div", { key: 'b2f0c86fa0e768474ba4d522f8c2b8157f89cd56', class: "zonos--dialog-layout", inert: !this.open, onClick: this.clickOutsideDialogHandler }, index.h("div", { key: '26cd8a7b98d38c53dcf4789c8781f0c1ced99633', class: "zonos--dialog" }, this.isLoading && (index.h("div", { key: '34d0ba841a9af9ca2ff6d21d0471113cc86cdec3', class: "zonos--loading" }, index.h("zonos-spinner", { key: '0109778b1a9734de0959035e3975414fb1cac1be', size: 30 }))), (this.headerText || !this.noCloseButton) && (index.h("div", { key: 'f80a4c337727500ee1ad92c1d80d7b3088eccc0f', class: "zonos--header" }, this.headerText && (index.h("h3", { key: '92b078fbbcd9ca5f8bf178fc67f2bee817d1e961', class: "zonos--header-text" }, this.headerText)), !this.noCloseButton && (index.h("zonos-button", { key: '698e45fffd466f22b6179aa220d35fe39ee5374c', class: "zonos--close-button", icon: index.h("zonos-icon", { "aria-label": "Close dialog", content: RemoveIcon }), noBackground: true, onClick: this.closeButtonHandler, variant: "subtle" })))), index.h("div", { key: 'a4012e5a48d5fbcc77cac038d8a39fe05f332008', class: classes.classes([
                 'zonos--body',
                 this.noBodyPadding && 'zonos--no-body-padding',
-            ]) }, index.h("slot", { key: '5f55d5771bc62a54865ee3bf8a25f571bfd7fbd1' })), index.h("slot", { key: '95053c3ebf850f1f9796163122f9224f4190d1c9', name: "dialog-footer" })))));
+            ]) }, index.h("slot", { key: 'd64b381cb91afde4ddbde58348a62612d9871c8e' })), index.h("slot", { key: '4ddd73bfe41ecd1c90b18f82a8d8f12a1eacf144', name: "dialog-footer" })))));
     }
     static get assetsDirs() { return ["assets"]; }
 };

package/dist/cjs/zonos-cart-items_12.cjs.entry.js

@@ -3,10 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b071017b.js');
-const cart = require('./cart-42cc98d9.js');
+const cart = require('./cart-401b6d32.js');
 const classes = require('./classes-b7918f56.js');
 const zonosStore = require('./zonosStore-4c6c85da.js');
-const submitGtag = require('./submitGtag-09f2e437.js');
+const submitGtag = require('./submitGtag-bc6af393.js');
 const getBorderRadius = require('./getBorderRadius-074b46ef.js');
 const isCheckoutMobile = require('./isCheckoutMobile-f491ca7c.js');
 const ILanguage = require('./ILanguage-98b04442.js');
@@ -719,7 +719,9 @@ const ZonosCustomerInfo = class {
             // overwrite the address object with the new data
             stripeEventDataObj = Object.assign(Object.assign({}, stripeEventDataObj), { complete: true, value: Object.assign(Object.assign({}, stripeEventDataObj === null || stripeEventDataObj === void 0 ? void 0 : stripeEventDataObj.value), { address: Object.assign(Object.assign({}, stripeEventDataObj === null || stripeEventDataObj === void 0 ? void 0 : stripeEventDataObj.value.address), { city: submitDataByKey.city ||
                             (stripeEventDataObj === null || stripeEventDataObj === void 0 ? void 0 : stripeEventDataObj.value.address.city) ||
-                            '', line1: submitDataByKey.line1, line2: submitDataByKey.line2, postal_code: submitDataByKey.postal_code, state: submitDataByKey.state }), firstName: submitDataByKey.name.split(' ')[0], lastName: submitDataByKey.name.split(' ')[1], name: submitDataByKey.name }) });
+                            '', line1: submitDataByKey.line1, line2: submitDataByKey.line2, postal_code: submitDataByKey.postal_code, state: submitDataByKey.state }), firstName: submitDataByKey.name.split(' ')[0],
+                    // get all the names after
+                    lastName: submitDataByKey.name.split(' ').slice(1).join(' '), name: submitDataByKey.name }) });
         };
         /**
          * handler for continue button click
@@ -848,12 +850,16 @@ const ZonosCustomerInfo = class {
             variant: this.submitBtnType }, cart.translate('Continue to shipping')))), cart.stripeStore.stripeAddressEventData && (index.h("zonos-address-update-dialog", { billingAddress: !cart.stripeStore.stripeShippingSameAsBilling &&
                 cart.stripeStore.stripeBillingAddressEventData
                 ? this.prepareAddressObject(cart.stripeStore.stripeBillingAddressEventData)
-                : null, "data-theme": theme, dialogLoading: this.isValidatingAddress, dialogOpen: this.openAddressValidationDialog, isMobile: this.isMobile, onCloseDialog: () => (this.openAddressValidationDialog = false), onContinueClicked: e => {
+                : null, "data-theme": theme, dialogLoading: this.isValidatingAddress, dialogOpen: this.openAddressValidationDialog, isMobile: this.isMobile, onCloseUpdateDialog: () => (this.openAddressValidationDialog = false), onContinueClicked: e => {
                 const submitData = e.detail;
                 this.transformTranslatedAddressToStripeEvent({
                     submitData,
                     type: 'shippingAddress',
                 });
+                this.transformTranslatedAddressToStripeEvent({
+                    submitData,
+                    type: 'billingAddress',
+                });
             }, shippingAddress: this.prepareAddressObject(cart.stripeStore.stripeAddressEventData), translatedBillingAddress: cart.stripeStore.translatedAddress.billingAddress, translatedShippingAddress: cart.stripeStore.translatedAddress.address }))));
     }
     get el() { return index.getElement(this); }

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

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b071017b.js');
-const cart = require('./cart-42cc98d9.js');
+const cart = require('./cart-401b6d32.js');
 const zonosStore = require('./zonosStore-4c6c85da.js');
-const submitGtag = require('./submitGtag-09f2e437.js');
+const submitGtag = require('./submitGtag-bc6af393.js');
 const isCheckoutMobile = require('./isCheckoutMobile-f491ca7c.js');
 const logError = require('./logError-4e2f2020.js');
 const classes = require('./classes-b7918f56.js');

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b071017b.js');
-const cart = require('./cart-42cc98d9.js');
+const cart = require('./cart-401b6d32.js');
 const zonosStore = require('./zonosStore-4c6c85da.js');
 const logError = require('./logError-4e2f2020.js');
 require('./isDarkColor-371a3b1a.js');

package/dist/cjs/zonos-country-flag.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b071017b.js');
-const cart = require('./cart-42cc98d9.js');
+const cart = require('./cart-401b6d32.js');
 const zonosStore = require('./zonosStore-4c6c85da.js');
 const classes = require('./classes-b7918f56.js');
 require('./logError-4e2f2020.js');

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b071017b.js');
-const cart = require('./cart-42cc98d9.js');
+const cart = require('./cart-401b6d32.js');
 const zonosStore = require('./zonosStore-4c6c85da.js');
 const formatStringWithLinks = require('./formatStringWithLinks-52341fc7.js');
 const isDarkColor = require('./isDarkColor-371a3b1a.js');

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b071017b.js');
-const cart = require('./cart-42cc98d9.js');
+const cart = require('./cart-401b6d32.js');
 const zonosStore = require('./zonosStore-4c6c85da.js');
 const classes = require('./classes-b7918f56.js');
 const formatStringWithLinks = require('./formatStringWithLinks-52341fc7.js');
@@ -217,18 +217,18 @@ const ZonosHelloDialog = class {
         const defaultMessage = formatStringWithLinks.formatStringWithLinks(defaultMessageStr);
         const currentPage = this.getCurrentPageEnum();
         const filteredMessages = customMessages.filter(x => x.pageName === currentPage);
-        return (index.h(index.Host, { key: 'af2c46bcc413205d644a2b94ee2ff568d3d004f2', class: "zonos--elements" }, index.h("div", { key: '67a563de9e702e370d057ee3cc45bc0c14feedc5', "aria-hidden": "true", class: classes.classes([
+        return (index.h(index.Host, { key: 'af2c46bcc413205d644a2b94ee2ff568d3d004f2', class: "zonos--elements" }, index.h("div", { key: 'e74b871d52d734ca9ad772d8ae1c5bef1aaf06f9', class: classes.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 && (index.h("div", { key: '412a8d2f4c01e4ff216feb92a979be5987bcd8c7' }, index.h("div", { key: 'b2921acfc77c6a402a14256a6f1c28607f6533e7', class: "zonos--hello-dialog-content" }, index.h("zonos-button", { key: 'aa623c0533a5f852dab7f0f98d6dc26f62ef899a', class: "zonos--close-button", icon: index.h("zonos-icon", { "aria-label": "Close Zonos Hello dialog", content: RemoveIcon }), noBackground: true, onClick: () => this.setIsOpen(false) }), index.h("zonos-v-stack", { key: '4fdac9331a5b2506a5ca1c7c1b6bfecf822bfcd9', spacing: 24 }, index.h("zonos-country-flag", { key: '57afef45e0bebe9bdfa715306f6ec2c30aca8dc1', class: "zonos--hello-country-flag", countryCode: selectedCountryCode }), index.h("zonos-v-stack", { key: '954b970c82fd631efadbd9c916e8bad78f0e1321', class: "zonos--hello-dialog-header", spacing: 4 }, index.h("zonos-text", { key: 'cde98a9636e6150d6cab009970938a0cf61bc05a', type: "boldSubheader" }, welcomeMessage), index.h("zonos-text", { key: 'b63fc79317f23854737c1f2dd2cbde38f3841f2a', innerHTML: defaultMessage, textColor: "gray-800" })), index.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 && (index.h("div", { key: 'd973d051143ab56e1af29b7ee812f1e5405b7768' }, index.h("div", { key: '1539bbc35aebccc9748e2d3b77b1717bd2e5dec5', class: "zonos--hello-dialog-content" }, index.h("zonos-button", { key: '675ff7bb8fdf8373c1aa21200ccc42ff9b585355', class: "zonos--close-button", icon: index.h("zonos-icon", { "aria-label": "Close Zonos Hello dialog", content: RemoveIcon }), noBackground: true, onClick: () => this.setIsOpen(false) }), index.h("zonos-v-stack", { key: 'c82a41c292facb00fd1a48ce69920b1de47d3f09', spacing: 24 }, index.h("zonos-country-flag", { key: '6b083cf77226e3766ad50a812c1201809593f3d6', class: "zonos--hello-country-flag", countryCode: selectedCountryCode }), index.h("zonos-v-stack", { key: 'f0ab4ca66f22b0448edff37fc730e72790b83de8', class: "zonos--hello-dialog-header", spacing: 4 }, index.h("zonos-text", { key: '574f22410d18fbeea3ac3fe22a735a2d858b5c9e', type: "boldSubheader" }, welcomeMessage), index.h("zonos-text", { key: '35f718094fcbd34d8e8ae9ec46fd0429cfcd1104', innerHTML: defaultMessage, textColor: "gray-800" })), index.h("zonos-v-stack", { key: 'e4bd687a84f1d48d0a20564a4ac9b9c1a24b3850', spacing: 8 }, this.restrictedItems.map(item => {
             var _a;
             return item && (index.h("zonos-banner", { bannerTitle: item.name, intent: "error" }, (_a = item.itemRestrictions) === null || _a === void 0 ? void 0 : _a.map(x => (index.h("zonos-text", { textColor: "red-800" }, x === null || x === void 0 ? void 0 : x.note)))));
-        }), index.h("zonos-card", { key: '6f5ef13c8ce1171b99c148f43f491ced8f29cd57', spacing: "12px" }, index.h("zonos-v-stack", { key: '816a373a6dcf69976279af51f09d136f18c6b4a8', spacing: 12 }, index.h("div", { key: '51fc31937cb4885c7a98ee5fbc0755a00158f172', class: "zonos--flex-message" }, index.h("zonos-icon", { key: 'bc659d649b3a7f046225270870e7ae31597027f4', "aria-label": "Duty de minimis", content: ImportIcon }), index.h("zonos-text", { key: 'e63ce2eb6f381718ca26962c7429f266bf8cf8d9' }, dutyDeMinimisMessage)), index.h("div", { key: '6f49eac81be52709ad8f35c04cccd7d2fec03b7a', class: "zonos--flex-message" }, index.h("zonos-icon", { key: 'd95f29c3c42480c89a34e831740cfdbb3d64c058', "aria-label": "Tax de minimis", content: MoneyIcon }), index.h("zonos-text", { key: 'c226092fef030070af3af1d45debab989fb4f1b7' }, taxDeMinimisMessage)), additionalInformation === null || additionalInformation === void 0 ? void 0 :
-            additionalInformation.map(info => (index.h("div", { class: "zonos--flex-message" }, index.h("zonos-icon", { "aria-label": "Additional information for buying goods from selected country", content: BagIcon }), index.h("zonos-text", { innerHTML: info })))))), filteredMessages.map(x => (index.h("zonos-custom-message", { icon: MessageIcon, message: x.message })))))), index.h("zonos-hello-dialog-footer", { key: '32739e817940a937b59380197934ced91f2afc50', appearanceSettings: this.appearanceSettings, setShowCountrySelect: value => this.setShowCountrySelect(value), setShowLanguageSelect: value => this.setShowLanguageSelect(value) }))), this.showCountrySelect && (index.h("div", { key: 'be58e393680370837ae35d5d4f85f77cf9620db2' }, index.h("zonos-country-select", { key: 'bc5c7e086513a44f817e5769acf2ca382b01fcc4', handleOnClose: () => this.setShowCountrySelect(false) }))), this.showLanguageSelect && (index.h("div", { key: '7cbee089b9661602bb23e5e2821030d04891f18a' }, index.h("zonos-language-select", { key: '55d654b2b339cfd83e3fe9814d914a382a891af3', handleOnClose: () => this.setShowLanguageSelect(false) }))))));
+        }), index.h("zonos-card", { key: '53fa284d1d87505e550bb893a895e944894cd8b6', spacing: "12px" }, index.h("zonos-v-stack", { key: 'ee8ecb870af875c1bbc49be88464094753d96b26', spacing: 12 }, index.h("div", { key: '9bb07220319b2635d66722c79a81c77c049e2aa0', class: "zonos--flex-message" }, index.h("zonos-icon", { key: 'cf345dace81622f3fd240a1538f25fce855d2ae2', "aria-label": "Duty de minimis", content: ImportIcon }), index.h("zonos-text", { key: '4a047bc63a8e2a1f88203241b927ac3f3f05a398' }, dutyDeMinimisMessage)), index.h("div", { key: 'af75e4d21ae1189d015376bfed3caf9156788ceb', class: "zonos--flex-message" }, index.h("zonos-icon", { key: '356fbbe36379ab8513822be08f8b4f3af4f8baf5', "aria-label": "Tax de minimis", content: MoneyIcon }), index.h("zonos-text", { key: '5b8fb3f1622bb49bbed21e0a81d6725a5825e931' }, taxDeMinimisMessage)), additionalInformation === null || additionalInformation === void 0 ? void 0 :
+            additionalInformation.map(info => (index.h("div", { class: "zonos--flex-message" }, index.h("zonos-icon", { "aria-label": "Additional information for buying goods from selected country", content: BagIcon }), index.h("zonos-text", { innerHTML: info })))))), filteredMessages.map(x => (index.h("zonos-custom-message", { icon: MessageIcon, message: x.message })))))), index.h("zonos-hello-dialog-footer", { key: '362873c8bac81efc80e44fae1d74a0bffae5e605', appearanceSettings: this.appearanceSettings, setShowCountrySelect: value => this.setShowCountrySelect(value), setShowLanguageSelect: value => this.setShowLanguageSelect(value) }))), this.showCountrySelect && (index.h("div", { key: '86d0d738e77d51666d3f63288aa1e954d539bb06' }, index.h("zonos-country-select", { key: '98766f096f97b249f0b4b3ebe053474de4ae498a', handleOnClose: () => this.setShowCountrySelect(false) }))), this.showLanguageSelect && (index.h("div", { key: '3268e1c0a9f7300b0e997ef238a4d95ec9d4f894' }, index.h("zonos-language-select", { key: '1b6d9dd2872332b2eba343ffd8798b1e87c71c2a', handleOnClose: () => this.setShowLanguageSelect(false) }))))));
     }
     static get assetsDirs() { return ["assets"]; }
     static get watchers() { return {

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

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b071017b.js');
 const zonosStore = require('./zonosStore-4c6c85da.js');
-const cart = require('./cart-42cc98d9.js');
+const cart = require('./cart-401b6d32.js');
 const classes = require('./classes-b7918f56.js');
 const logError = require('./logError-4e2f2020.js');
 const getHasMoreSpaceOnRight = require('./getHasMoreSpaceOnRight-4c94667f.js');

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b071017b.js');
-const cart = require('./cart-42cc98d9.js');
+const cart = require('./cart-401b6d32.js');
 const zonosStore = require('./zonosStore-4c6c85da.js');
 const ILanguage = require('./ILanguage-98b04442.js');
 require('./logError-4e2f2020.js');

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

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-b071017b.js');
 const zonosStore = require('./zonosStore-4c6c85da.js');
 const classes = require('./classes-b7918f56.js');
-const cart = require('./cart-42cc98d9.js');
+const cart = require('./cart-401b6d32.js');
 const logError = require('./logError-4e2f2020.js');
 require('./isDarkColor-371a3b1a.js');
 require('./getBorderRadius-074b46ef.js');

package/dist/collection/components/checkout/zonos-checkout/zonos-address-update-dialog/zonos-address-form/zonos-address-form.js

@@ -24,16 +24,17 @@ export class ZonosAddressForm {
     render() {
         const { city, country, line1, line2, name, phone, postal_code, state } = this.localAddress;
         const firstName = name.split(' ')[0] || '';
-        const lastName = name.split(' ')[1] || '';
-        return (h(Host, { key: '9c1ee87200d1f90e9dfac58c49aabba1777373a9', class: "zonos--address-form zonos--elements" }, h("div", { key: 'eec3416268ff2324fd751408552705086905423d', class: "zonos--title" }, h("zonos-text", { key: 'a4c254f78420dcfc712e1a83b20dd3ac9e64c460', textColor: "gray-700", type: "smallHeader" }, this.addressType === 'shipping'
+        // get the rest of the name if it exists
+        const lastName = name.split(' ').slice(1).join(' ') || '';
+        return (h(Host, { key: '8b578737e33203a23563be7e9be0778deec99bbf', class: "zonos--address-form zonos--elements" }, h("div", { key: '793675a1348547bf3f781788956befe325191011', class: "zonos--title" }, h("zonos-text", { key: '13de35cb0a7c98a48342e3fb86ae3ade9f5b88d9', textColor: "gray-700", type: "smallHeader" }, this.addressType === 'shipping'
             ? translate('Shipping')
-            : translate('Billing'))), h("div", { key: 'b8109545d282fb8c06a2e791c30088018d6ffec0', class: "zonos--address-group" }, h("div", { key: '833a395984cd75242e5d97697fd6566f11932d1b', class: "zonos--contact" }, h("zonos-text", { key: 'e60f574e95162aabf6465b878fc9b16c708e8029', type: "label" }, translate('Contact')), h("zonos-input", { key: '24cd24a362a1bbc76d0c91718c48ae32baa20ae6', class: "zonos--form-email", inputLabel: translate('Email'), inputValue: this.currentAddress.email, isDisabled: true }), h("div", { key: '84e64ef44eb3b39ac7ab542e07d7a52a95377cae', class: "zonos--name zonos--address-row" }, h("zonos-input", { key: '26621aca0d57a7fee743874b8d11af5f58c91b69', class: "zonos--form-first-name", inputLabel: translate('First name'), inputValue: firstName, isError: isTextContainsNonLatinChars(firstName), onInputChange: e => this.onInputChange({
+            : translate('Billing'))), h("div", { key: '2c5de5b5283fb99ee5f8b61d7a217177986fc2db', class: "zonos--address-group" }, h("div", { key: '23bf3c893071000d5995a5f175867bab11929193', class: "zonos--contact" }, h("zonos-text", { key: '7cdfe2a84ebad89ba5b16498d75def99cf392384', type: "label" }, translate('Contact')), h("zonos-input", { key: '1c39c38767fd306c5eb1164cdc989b8291209cf0', class: "zonos--form-email", inputLabel: translate('Email'), inputValue: this.currentAddress.email, isDisabled: true }), h("div", { key: 'cbdf61217125e22b1a6cec9a340ef0aca2c75670', class: "zonos--name zonos--address-row" }, h("zonos-input", { key: '360c99e7b2c6caa64580d5768b5bb53368927275', class: "zonos--form-first-name", inputLabel: translate('First name'), inputValue: firstName, isError: isTextContainsNonLatinChars(firstName), onInputChange: e => this.onInputChange({
                 key: 'name',
                 value: `${e.detail} ${lastName}`,
-            }) }), h("zonos-input", { key: '01e3e5038b4a4311dd5874a1213f936451dc300d', class: "zonos--form-last-name", inputLabel: translate('Last name'), inputValue: lastName, isError: isTextContainsNonLatinChars(lastName), onInputChange: e => this.onInputChange({
+            }) }), h("zonos-input", { key: '8ce5fa5c15c6f7928339ea10009ce0e68954a91f', class: "zonos--form-last-name", inputLabel: translate('Last name'), inputValue: lastName, isError: isTextContainsNonLatinChars(lastName), onInputChange: e => this.onInputChange({
                 key: 'name',
                 value: `${firstName} ${e.detail}`,
-            }) }))), h("div", { key: 'eb42dece28082ff16a453110b3208de5b44b9fdb', class: "zonos--address" }, h("zonos-text", { key: '3557122c716533be7b36a8bd395ea616a7061665', type: "label" }, translate('Address')), h("zonos-input", { key: 'bcc7d84d530f2f3a10537117eb6ef143df7cc8e2', class: "zonos--form-country", inputLabel: translate('Country'), inputValue: country, isDisabled: true }), h("zonos-input", { key: '6ce78e25151a129b69b501cf768604134a395e85', class: "zonos--form-line1", inputLabel: translate('Address line 1'), inputValue: line1, isError: isTextContainsNonLatinChars(line1), onInputChange: e => this.onInputChange({ key: 'line1', value: e.detail }) }), h("zonos-input", { key: '6f7a18010e2d8131327154a31ba58544df56768c', class: "zonos--form-line2", inputLabel: translate('Address line 2'), inputValue: line2, isError: isTextContainsNonLatinChars(line2), onInputChange: e => this.onInputChange({ key: 'line2', value: e.detail }) }), h("div", { key: '48afbf7a3cbd26fddfea4f2799005a51b1c3d3c6', class: "zonos--address-row" }, h("zonos-input", { key: '6decf8c430d8d25b2c555b110009da74e0ac9e5f', class: "zonos--form-city", inputLabel: translate('City'), inputValue: city, isError: isTextContainsNonLatinChars(city), onInputChange: e => this.onInputChange({ key: 'city', value: e.detail }) }), h("zonos-input", { key: '065e1be213d3cfec7749ab32890f96b0b484a25a', class: "zonos--form-state", inputLabel: translate('State/Province'), inputValue: state, isError: isTextContainsNonLatinChars(state), onInputChange: e => this.onInputChange({ key: 'state', value: e.detail }) })), h("zonos-input", { key: 'a69244bf84c9fd007c9ad4aad2b6cc6d44420775', class: "zonos--form-postal-code", inputLabel: translate('Postal code'), inputValue: postal_code, isError: isTextContainsNonLatinChars(postal_code), onInputChange: e => this.onInputChange({ key: 'postal_code', value: e.detail }) }), h("zonos-input", { key: '0bcc89de1ecc4aae8a69d74eff42dfd117ada40b', class: "zonos--form-phone", inputLabel: translate('Phone number'), inputValue: phone, onInputChange: e => this.onInputChange({ key: 'phone', value: e.detail }) })))));
+            }) }))), h("div", { key: '7b4fa2d3baa6cb257e7688e5ba6777123898b3fd', class: "zonos--address" }, h("zonos-text", { key: '9d5782331b2642755a755aeb7f98c9f4d87f9a20', type: "label" }, translate('Address')), h("zonos-input", { key: 'a622025924ca86bdbf1d3c04b79e6dee172b4c42', class: "zonos--form-country", inputLabel: translate('Country'), inputValue: country, isDisabled: true }), h("zonos-input", { key: 'f99b3a74db09ab5730878e80705b9aeac76bf800', class: "zonos--form-line1", inputLabel: translate('Address line 1'), inputValue: line1, isError: isTextContainsNonLatinChars(line1), onInputChange: e => this.onInputChange({ key: 'line1', value: e.detail }) }), h("zonos-input", { key: '5d16aefa45a78045c87d166aaaec0255606e455e', class: "zonos--form-line2", inputLabel: translate('Address line 2'), inputValue: line2, isError: isTextContainsNonLatinChars(line2), onInputChange: e => this.onInputChange({ key: 'line2', value: e.detail }) }), h("div", { key: 'dc166be9381142835d72e731cb38a718522a068a', class: "zonos--address-row" }, h("zonos-input", { key: '4f1a98f9d10ce0cff3ef18a3037a12382552b31d', class: "zonos--form-city", inputLabel: translate('City'), inputValue: city, isError: isTextContainsNonLatinChars(city), onInputChange: e => this.onInputChange({ key: 'city', value: e.detail }) }), h("zonos-input", { key: 'd4f97900b5fe2e1619950a52d1d1f716a8bc19ff', class: "zonos--form-state", inputLabel: translate('State/Province'), inputValue: state, isError: isTextContainsNonLatinChars(state), onInputChange: e => this.onInputChange({ key: 'state', value: e.detail }) })), h("zonos-input", { key: 'cf1eb0ca5cd15c8412a2e1246aaf2e39361dc733', class: "zonos--form-postal-code", inputLabel: translate('Postal code'), inputValue: postal_code, isError: isTextContainsNonLatinChars(postal_code), onInputChange: e => this.onInputChange({ key: 'postal_code', value: e.detail }) }), h("zonos-input", { key: '7421c82847eded6bdbcce49ef8196124d8e50c1d', class: "zonos--form-phone", inputLabel: translate('Phone number'), inputValue: phone, onInputChange: e => this.onInputChange({ key: 'phone', value: e.detail }) })))));
     }
     static get is() { return "zonos-address-form"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/checkout/zonos-checkout/zonos-address-update-dialog/zonos-address-update-dialog.js

@@ -10,8 +10,8 @@ export class ZonosAddressUpdateDialog {
         /**
          * handler for close button click
          */
-        this.closeDialogHandler = () => {
-            this.closeDialog.emit();
+        this.closeUpdateDialogHandler = () => {
+            this.closeUpdateDialog.emit();
         };
         /**
          * Extract value from translated object
@@ -141,24 +141,24 @@ export class ZonosAddressUpdateDialog {
             : this.submitBtnType || 'standard';
         const billing = this.billingAddress;
         const shipping = this.shippingAddress;
-        return (h(Host, { key: '03535edacb348258592641baa349e9dcf14bf78c', class: classes([
+        return (h(Host, { key: '655845cef04f4af526b1a1c4e49243c4f2b4c7f6', class: classes([
                 'zonos--address-update-dialog zonos--elements',
                 this.isMobile && 'mobile',
-            ]) }, h("zonos-dialog", { key: 'c16871425dffe955d422ffa5b9aee1ece0da2890', isLoading: this.dialogLoading, mobile: this.isMobile, noBodyPadding: true, noBorder: true, noClickOutside: true, noCloseButton: true, onCloseDialog: () => this.closeDialog.emit(), open: this.dialogOpen, width: "568px" }, h("div", { key: 'e4fad501f7cfedc5783774d8b1bf785d6947d3c8', class: "zonos--body" }, h("div", { key: '973e7a8097b8c8f60e47e6ad9d8311a64a5a6ff0', class: "zonos--dialog-header" }, h("div", { key: '89c82b6ff3723056d161560da22bd16a992afee7', class: "zonos--dialog-title" }, h("zonos-text", { key: 'bf92ef0b40ea67a492164fedb95dd68b7d023e85', type: "title" }, translate('Update your address')), h("zonos-button", { key: '4e7a1905c976cec396db5c34f633b383bba0d55a', class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close checkout dialog", content: RemoveIcon }), noBackground: true, onClick: () => this.closeDialogHandler() })), h("zonos-text", { key: '47b42d8cc14c4757e3fc9f2f43eafbd8d9e9df38' }, translate('To ensure delivery all address details must be in Latin characters.'))), h("div", { key: '28d9804f0a18f143ce541c2c511cbfa21a2a416f', class: "zonos--group" }, h("zonos-text", { key: '43ec5a9fc8594d065b256952ca8e9392fba03839', class: "zonos--what-you-entered", type: "semiBoldLabel" }, translate('What you entered')), h("div", { key: 'b7eb7781ce6aefe20f89b4d5fba190f0102eb5d1', class: "zonos--address-display-group" }, h("zonos-address-display", { key: '152c53176a46575677723ca47386e484c659927a', addressType: "shipping", currentAddress: shipping }), billing && (h("zonos-address-display", { key: '6c7ac2b49d121c26ce45f09a1eac9ef456d45910', addressType: "billing", currentAddress: billing }))), h("div", { key: '2bda98bb0ac9bafcb009ff36fb97a9fc62ce7e2d', class: "zonos--address-form-section" }, h("zonos-text", { key: '87d3380072a049ccde71ba1b752aedd36830348b', type: "semiBoldLabel" }, translate('Translated address')), h("zonos-address-form", { key: '2cb36251c6549da05e272183b2c37478b4166fea', addressType: "shipping", class: "zonos--shipping-address-form", currentAddress: shipping, onAddressChange: e => {
+            ]) }, h("zonos-dialog", { key: 'eab429bb78ce6f05ba463d8748d7edd5499402fa', isLoading: this.dialogLoading, mobile: this.isMobile, noBodyPadding: true, noBorder: true, noClickOutside: true, noCloseButton: true, onCloseDialog: () => this.closeUpdateDialog.emit(), open: this.dialogOpen, width: "568px" }, h("div", { key: '08f0400e62addfcaffd91bf5200999d29bbd2da9', class: "zonos--body" }, h("div", { key: '8699df5e2f823e19066fbb552ba2a66c127c05e9', class: "zonos--dialog-header" }, h("div", { key: '92e0ff932dcdb0e5b59ea34b688d1ef8e31bfeb3', class: "zonos--dialog-title" }, h("zonos-text", { key: 'aaac3375526bddb319ce7c8f49bde30da7210264', type: "title" }, translate('Update your address')), h("zonos-button", { key: '66abf7b74045e68e84e631298504236d32ca9c4e', class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close checkout dialog", content: RemoveIcon }), noBackground: true, onClick: () => this.closeUpdateDialogHandler() })), h("zonos-text", { key: 'ffb3d8f169867d5f6dff269e1becd99c98c5a7da' }, translate('To ensure delivery all address details must be in Latin characters.'))), h("div", { key: '2cb61f06ce174e2317870decfdd337c67c5cf128', class: "zonos--group" }, h("zonos-text", { key: 'a616c540984120b468e52bccfb380ea3974ced22', class: "zonos--what-you-entered", type: "semiBoldLabel" }, translate('What you entered')), h("div", { key: '6ac8f9c14472370c501af1b0d50bd8f8746b7694', class: "zonos--address-display-group" }, h("zonos-address-display", { key: 'ea2c67a7bba51c99f80be968e448beeffcf1f863', addressType: "shipping", currentAddress: shipping }), billing && (h("zonos-address-display", { key: '7ea1683dc04a292810e04ed6550d86086f25186f', addressType: "billing", currentAddress: billing }))), h("div", { key: '4d1cd9096943518b8b4e267608a5e1542befb6a9', class: "zonos--address-form-section" }, h("zonos-text", { key: 'e4184a2cc618d26d43979fa8cfe06070cf8b5af8', type: "semiBoldLabel" }, translate('Translated address')), h("zonos-address-form", { key: 'c55d9d3c658565ceb7c7b879f444e3937b9f7ad6', addressType: "shipping", class: "zonos--shipping-address-form", currentAddress: shipping, onAddressChange: e => {
                 const address = e.detail;
                 this.translatedShippingAddressState =
                     this.buildTranslateAddressState({
                         currentAddress: shipping,
                         translatedAddress: address,
                     });
-            }, translatedAddress: this.translatedShippingAddressState }), billing && (h("zonos-address-form", { key: '9bf5ebd6fb08851716a72c855451bfeb3ee0ed68', addressType: "billing", class: "zonos--billing-address-form", currentAddress: billing, onAddressChange: e => {
+            }, translatedAddress: this.translatedShippingAddressState }), billing && (h("zonos-address-form", { key: 'c3facc295b1322bb00baa6081f343dcea4f10777', addressType: "billing", class: "zonos--billing-address-form", currentAddress: billing, onAddressChange: e => {
                 const address = e.detail;
                 this.translatedBillingAddressState =
                     this.buildTranslateAddressState({
                         currentAddress: billing,
                         translatedAddress: address,
                     });
-            }, translatedAddress: this.translatedBillingAddressState })))), h("div", { key: '621df9c8919973b37c62aca5727bde3635086a6b', class: "zonos--group-btn" }, h("div", { key: '95e9fd31418abc8e89ceef24af7cc251ee45ac93', class: "zonos--button-wrapper" }, h("zonos-button", { key: 'bef31fc81e7cc0f2b3f7ab875a29978b07865b6a', class: "zonos--cancel-btn", onClick: () => this.closeDialogHandler(), variant: "subtle" }, translate('Cancel')), h("zonos-button", { key: '9d183153541766b421c3420681c1159ffa599682', backgroundColor: this.submitBtnColor, class: "zonos--update-btn", loading: this.continueLoading, onClick: () => this.continueClickHandler(), size: "sm", variant: submitBtnType }, translate('Update address'))))))));
+            }, translatedAddress: this.translatedBillingAddressState })))), h("div", { key: '1c89c9604ba0dece40275fcfac97e7f93706b430', class: "zonos--group-btn" }, h("div", { key: 'e47d393940b094b4e123864e4070daa87f0616f0', class: "zonos--button-wrapper" }, h("zonos-button", { key: '216b7afe268a4acd6bb8a76b7f5a32dc09bdd4f6', class: "zonos--cancel-btn", onClick: () => this.closeUpdateDialogHandler(), variant: "subtle" }, translate('Cancel')), h("zonos-button", { key: 'acbacb92cedb325b46843d8f3aff13f4e7c86ab5', backgroundColor: this.submitBtnColor, class: "zonos--update-btn", loading: this.continueLoading, onClick: () => this.continueClickHandler(), size: "sm", variant: submitBtnType }, translate('Update address'))))))));
     }
     static get is() { return "zonos-address-update-dialog"; }
     static get encapsulation() { return "shadow"; }
@@ -379,8 +379,8 @@ export class ZonosAddressUpdateDialog {
     }
     static get events() {
         return [{
-                "method": "closeDialog",
-                "name": "closeDialog",
+                "method": "closeUpdateDialog",
+                "name": "closeUpdateDialog",
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,

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

@@ -49,7 +49,9 @@ export class ZonosCustomerInfo {
             // overwrite the address object with the new data
             stripeEventDataObj = Object.assign(Object.assign({}, stripeEventDataObj), { complete: true, value: Object.assign(Object.assign({}, stripeEventDataObj === null || stripeEventDataObj === void 0 ? void 0 : stripeEventDataObj.value), { address: Object.assign(Object.assign({}, stripeEventDataObj === null || stripeEventDataObj === void 0 ? void 0 : stripeEventDataObj.value.address), { city: submitDataByKey.city ||
                             (stripeEventDataObj === null || stripeEventDataObj === void 0 ? void 0 : stripeEventDataObj.value.address.city) ||
-                            '', line1: submitDataByKey.line1, line2: submitDataByKey.line2, postal_code: submitDataByKey.postal_code, state: submitDataByKey.state }), firstName: submitDataByKey.name.split(' ')[0], lastName: submitDataByKey.name.split(' ')[1], name: submitDataByKey.name }) });
+                            '', line1: submitDataByKey.line1, line2: submitDataByKey.line2, postal_code: submitDataByKey.postal_code, state: submitDataByKey.state }), firstName: submitDataByKey.name.split(' ')[0],
+                    // get all the names after
+                    lastName: submitDataByKey.name.split(' ').slice(1).join(' '), name: submitDataByKey.name }) });
         };
         /**
          * handler for continue button click
@@ -178,12 +180,16 @@ export class ZonosCustomerInfo {
             variant: this.submitBtnType }, translate('Continue to shipping')))), stripeStore.stripeAddressEventData && (h("zonos-address-update-dialog", { billingAddress: !stripeStore.stripeShippingSameAsBilling &&
                 stripeStore.stripeBillingAddressEventData
                 ? this.prepareAddressObject(stripeStore.stripeBillingAddressEventData)
-                : null, "data-theme": theme, dialogLoading: this.isValidatingAddress, dialogOpen: this.openAddressValidationDialog, isMobile: this.isMobile, onCloseDialog: () => (this.openAddressValidationDialog = false), onContinueClicked: e => {
+                : null, "data-theme": theme, dialogLoading: this.isValidatingAddress, dialogOpen: this.openAddressValidationDialog, isMobile: this.isMobile, onCloseUpdateDialog: () => (this.openAddressValidationDialog = false), onContinueClicked: e => {
                 const submitData = e.detail;
                 this.transformTranslatedAddressToStripeEvent({
                     submitData,
                     type: 'shippingAddress',
                 });
+                this.transformTranslatedAddressToStripeEvent({
+                    submitData,
+                    type: 'billingAddress',
+                });
             }, shippingAddress: this.prepareAddressObject(stripeStore.stripeAddressEventData), translatedBillingAddress: stripeStore.translatedAddress.billingAddress, translatedShippingAddress: stripeStore.translatedAddress.address }))));
     }
     static get is() { return "zonos-customer-info"; }