@zonos/elements 1.3.18-alpha.0 → 1.3.18-alpha.1

package/dist/collection/components/checkout/zonos-checkout/zonos-cart-restricted-items/zonos-cart-restricted-items.css

@@ -0,0 +1,105 @@
+: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;
+}
+
+/* All sets of variable are here */
+/* smooth font rendering */
+:host {
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+}
+
+:host {
+  overflow: auto;
+  position: relative;
+}
+:host zonos-banner {
+  margin-bottom: 12px;
+}
+:host .zonos--cart-title-collapse-trigger {
+  display: flex;
+  flex-direction: row;
+  gap: 24px;
+  align-items: center;
+  background: var(--zonos-elements-gray-0);
+  width: 100%;
+  border: none;
+  cursor: pointer;
+  margin-bottom: 16px;
+  position: sticky;
+  top: 0;
+  z-index: 1;
+  transition: 0.5s all ease;
+}
+:host .zonos--cart-title-collapse-trigger zonos-icon {
+  transition: transform 0.3s ease;
+}
+:host .zonos--cart-title-collapse-trigger.collapsed {
+  margin-bottom: 0;
+}
+:host .zonos--cart-title-collapse-trigger.collapsed zonos-icon {
+  transform: rotate(180deg);
+}
+:host .zonos--cart-title-collapse-trigger::before, :host .zonos--cart-title-collapse-trigger::after {
+  content: "";
+  display: block;
+  width: 80%;
+  height: 1px;
+  background-color: var(--zonos-elements-border-color);
+  flex-shrink: 1;
+}
+:host .zonos--cart-title-collapse-trigger .zonos--title-wrapper {
+  flex-grow: 1;
+  flex-shrink: 0;
+  display: inline-flex;
+  flex-direction: row;
+  gap: 8px;
+  align-items: center;
+}
+:host .zonos--cart-table {
+  opacity: 0.5;
+  width: 100%;
+  border: none;
+  border-collapse: collapse;
+  overflow: auto;
+  font-size: var(--zonos-elements-font-size-base);
+}
+:host .zonos--cart-table .zonos--column {
+  padding: 8px;
+  font-size: var(--zonos-elements-font-size-base);
+}
+:host .zonos--cart-table .zonos--column:last-child {
+  text-align: right;
+}
+:host .zonos--cart-table .zonos--column:first-child {
+  width: 60px;
+}
+:host img {
+  min-width: 40px;
+}
+
+:host(.collapsed) {
+  flex-shrink: 0;
+}

package/dist/collection/components/checkout/zonos-checkout/zonos-cart-restricted-items/zonos-cart-restricted-items.js

@@ -0,0 +1,101 @@
+import { getAssetPath, h, Host } from "@stencil/core";
+import { cartStore, cartStoreHasOneEligibleItem, } from "../../../store/checkout/cart";
+import { translate } from "../../../store/translationStore";
+import { classes } from "../../../utils/classes";
+import { formatCurrency } from "../../../utils/formatCurrency";
+// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths
+import ChevronUpIcon from "./assets/ChevronUpIcon.svg";
+export class ZonosCartRestrictedItems {
+    constructor() {
+        this.hide = false;
+        this.errorImages = [];
+        this.internalCollapsed = true;
+        this.firstRender = true;
+    }
+    componentDidLoad() {
+        // Reset if it's first render
+        this.firstRender = true;
+    }
+    render() {
+        var _a;
+        const emptyItemImg = getAssetPath('./assets/empty-item.jpeg');
+        const rate = ((_a = cartStore.exchangeRate) === null || _a === void 0 ? void 0 : _a.rate) || 1;
+        const restrictedItemTotal = cartStore.restrictedItems.length;
+        if (this.hide || restrictedItemTotal === 0) {
+            // show nothing if the parent is collapsed or no restricted items
+            return null;
+        }
+        if (this.firstRender) {
+            // Auto expand if all items are restricted
+            this.internalCollapsed = cartStoreHasOneEligibleItem();
+            this.firstRender = false;
+        }
+        return (h(Host, { class: classes([
+                'zonos--cart-restricted-items',
+                'zonos--elements',
+                this.internalCollapsed && 'collapsed',
+            ]) }, h("button", { class: classes([
+                'zonos--cart-title-collapse-trigger',
+                this.internalCollapsed && 'collapsed',
+            ]), onClick: () => {
+                this.internalCollapsed = !this.internalCollapsed;
+            } }, h("div", { class: "zonos--title-wrapper" }, h("zonos-text", { textColor: "red-600", type: "label" }, `${translate(this.internalCollapsed ? 'Show' : 'Hide')} ${restrictedItemTotal} ${translate('restricted items')}`), h("zonos-icon", { content: ChevronUpIcon, iconColor: "red-600" }))), h("zonos-collapse", { collapsed: this.internalCollapsed }, h("zonos-banner", { bannerTitle: translate('The following items are unable to be shipped to your country and are not included in your cart total.'), intent: "error" }), h("table", { class: "zonos--cart-table" }, h("tbody", null, cartStore.restrictedItems.map((item, index) => {
+            var _a, _b;
+            const itemImg = item.imageUrl;
+            return (h("tr", { class: "zonos--cart-item" }, h("td", { class: "zonos--column zonos--cart-item-image" }, itemImg && !this.errorImages.includes(itemImg) ? (h("img", { alt: 
+                // Use matched item name if available
+                ((_a = item.matchedItem) === null || _a === void 0 ? void 0 : _a.name) ||
+                    item.name ||
+                    `Restricted item ${index + 1}`, onError: () => {
+                    this.errorImages = [...this.errorImages, itemImg];
+                }, src: itemImg, style: {
+                    'min-width': '40px',
+                }, width: 40 })) : (h("img", { alt: item.name || `Restricted item ${index + 1}`, src: emptyItemImg, width: 40 }))), h("td", { class: "zonos--column zonos--cart-item-name" }, h("zonos-text", { type: "label" }, ((_b = item.matchedItem) === null || _b === void 0 ? void 0 : _b.name) || item.name), h("zonos-text", { type: "caption" }, item.restriction.reason)), h("td", { class: "zonos--column zonos--cart-item-price" }, h("zonos-text", { type: "semiBoldLabel" }, formatCurrency({
+                amount: item.amount * item.quantity * rate,
+                currency: cartStore.currency,
+            })))));
+        }))))));
+    }
+    static get is() { return "zonos-cart-restricted-items"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["zonos-cart-restricted-items.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["zonos-cart-restricted-items.css"]
+        };
+    }
+    static get assetsDirs() { return ["assets"]; }
+    static get properties() {
+        return {
+            "hide": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "This is to hide the section when the parent collapse on mobile"
+                },
+                "attribute": "hide",
+                "reflect": false,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "errorImages": {},
+            "internalCollapsed": {},
+            "firstRender": {}
+        };
+    }
+}

package/dist/collection/components/checkout/zonos-checkout/zonos-cart-subtotal/zonos-cart-subtotal.js

@@ -1,5 +1,5 @@
 import { Fragment, h, Host } from "@stencil/core";
-import { cartStore } from "../../../store/checkout/cart";
+import { cartStore, cartStoreHasOneEligibleItem, } from "../../../store/checkout/cart";
 import { translate } from "../../../store/translationStore";
 import { formatCurrency } from "../../../utils/formatCurrency";
 // These assets neet to be in relative path as https://www.npmjs.com/package/stencil-inline-svg suggested
@@ -8,6 +8,9 @@ import InfoIcon from "./assets/InfoIcon.svg";
 export class ZonosCartSubtotal {
     render() {
         const showDutyTaxesInfo = cartStore.step === 'payment' || cartStore.step === 'shipping';
+        // Show 0 for subtotal and total when all items are restricted
+        const total = cartStoreHasOneEligibleItem() ? cartStore.total : 0;
+        const subtotal = cartStoreHasOneEligibleItem() ? cartStore.subtotal : 0;
         const renderShippingInfo = () => {
             if (!cartStore.selectedShippingOption) {
                 return (h(Fragment, null, h("zonos-text", { class: "zonos--title", type: "semiBoldLabel" }, translate('Shipping')), h("zonos-text", { class: "zonos--caption", type: "caption" }, translate('No shipping method selected'))));
@@ -15,7 +18,7 @@ export class ZonosCartSubtotal {
             return (h(Fragment, null, h("zonos-text", { class: "zonos--title", type: "semiBoldLabel" }, cartStore.selectedShippingOption.displayName), cartStore.selectedShippingOptionTransitTime && (h("zonos-text", { class: "zonos--caption", type: "caption" }, cartStore.selectedShippingOptionTransitTime, ' ', translate('business days')))));
         };
         return (h(Host, { class: "zonos--cart-subtotal zonos--elements" }, h("table", { class: "zonos--cart-table" }, h("tr", { class: "zonos--row zonos--cart-subtotal" }, h("td", { class: "zonos--column" }), h("td", { class: "zonos--column zonos--cart-subtotal-title" }, h("zonos-text", { type: "semiBoldLabel" }, translate('Cart subtotal'))), h("td", { class: "zonos--column zonos--cart-subtotal-price" }, h("zonos-text", { type: "semiBoldLabel" }, formatCurrency({
-            amount: cartStore.subtotal,
+            amount: subtotal,
             currency: cartStore.currency,
         })))), h("tr", { class: "zonos--row zonos--cart-shipping" }, h("td", { class: "zonos--column" }), h("td", { class: "zonos--column zonos--cart-subtotal-title" }, renderShippingInfo()), h("td", { class: "zonos--column zonos--cart-subtotal-price" }, cartStore.shipping
             ? formatCurrency({
@@ -28,7 +31,7 @@ export class ZonosCartSubtotal {
                 currency: cartStore.currency,
             })
             : '-', cartStore.isSelectedShippingGuarantee && (h("zonos-badge", null, translate('Guaranteed'))))))), h("tr", { class: "zonos--row zonos--cart-pay-total" }, h("td", { class: "zonos--column" }), h("td", { class: "zonos--column" }, h("zonos-text", { class: "zonos--title", type: "semiBoldLabel" }, translate('Order total'))), h("td", { class: "zonos--column" }, h("zonos-text", { type: "semiBoldLabel" }, formatCurrency({
-            amount: cartStore.total,
+            amount: total,
             currency: cartStore.currency,
         })))))));
     }

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

@@ -68,6 +68,9 @@
 :host zonos-button {
   box-shadow: 0 0 1px 0 var(--zonos-elements-gray-600);
 }
+:host zonos-button {
+  box-shadow: 0 0 1px 0 var(--zonos-elements-gray-600);
+}
 :host .zonos--group-btn {
   position: sticky;
   display: flex;

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

@@ -161,7 +161,7 @@
 @media (max-width: 768px) {
   :host(.mobile) .zonos--content .zonos--left,
   :host(.mobile) .zonos--content .zonos--right {
-    padding-bottom: 0px;
+    padding-bottom: 0;
   }
 }
 :host(.mobile) .zonos--content .zonos--left {

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

@@ -480,7 +480,7 @@ export class ZonosCheckout {
                 } }), h("zonos-collapse", {
                 // only collapsible on mobile
                 collapsed: this.collapseReviewMobile && this.isMobile
-            }, h("zonos-cart-items", null), this.isMobile && (h("zonos-v-stack", { spacing: 16 }, h("zonos-cart-subtotal", null), h("zonos-custom-message", { class: "zonos--checkout-default-message", icon: MessageIcon, message: defaultMessage }))))), !this.isMobile && (h("zonos-v-stack", { spacing: 16 }, h("zonos-cart-subtotal", null), h("zonos-custom-message", { class: "zonos--checkout-default-message", icon: MessageIcon, message: defaultMessage }))))))), (cartStore.step === 'finish' || cartStore.step === 'error') && (h("div", { class: "zonos--done", "data-theme": rightSideTheme }, h("div", { class: "zonos--header" }, renderLogo(), h("zonos-button", { class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close checkout dialog", content: RemoveIcon }), noBackground: true, onClick: () => this.handleFinishClick(), theme: rightSideTheme })), h("zonos-checkout-finish", { borderRadius: style, onCloseClick: () => this.handleFinishClick(), overrideNotification: cartStore.step === 'error' && !!cartStore.error
+            }, h("zonos-cart-items", null), this.isMobile && (h("zonos-v-stack", { spacing: 16 }, h("zonos-cart-subtotal", null), h("zonos-custom-message", { class: "zonos--checkout-default-message", icon: MessageIcon, message: defaultMessage }))))), h("zonos-cart-restricted-items", null), !this.isMobile && (h("zonos-v-stack", { spacing: 16 }, h("zonos-cart-subtotal", null), h("zonos-custom-message", { class: "zonos--checkout-default-message", icon: MessageIcon, message: defaultMessage }))))))), (cartStore.step === 'finish' || cartStore.step === 'error') && (h("div", { class: "zonos--done", "data-theme": rightSideTheme }, h("div", { class: "zonos--header" }, renderLogo(), h("zonos-button", { class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close checkout dialog", content: RemoveIcon }), noBackground: true, onClick: () => this.handleFinishClick(), theme: rightSideTheme })), h("zonos-checkout-finish", { borderRadius: style, onCloseClick: () => this.handleFinishClick(), overrideNotification: cartStore.step === 'error' && !!cartStore.error
                     ? Object.assign(Object.assign({}, cartStore.error), { type: 'error' }) : undefined, storybookForceStatus: this.storybookPaymentStatusOverride }))), h("zonos-checkout-footer", { "data-theme": rightSideTheme, mobile: this.isMobile,
                 /**
                  * For this component, use slot instead of passing JSX through prop of other component. Because

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

@@ -115,6 +115,8 @@ export class ZonosCustomerInfo {
         this.isMobile = false;
         this.defaultAddress = null;
         this.showErrorBanner = false;
+        this.shippingCountry = '';
+        this.isCheckingForRestrictedItems = false;
         this.isValidatingAddress = false;
         this.invalidShippingCharacterList = null;
         this.invalidBillingCharacterList = null;
@@ -146,10 +148,22 @@ export class ZonosCustomerInfo {
         return invalidList;
     }
     render() {
-        var _a;
+        var _a, _b;
         if (!stripeStore.stripeElements) {
             return null;
         }
+        // init the shipping country when shipping address is available
+        if (!this.shippingCountry && stripeStore.stripeAddressEventData) {
+            this.shippingCountry =
+                (_a = stripeStore.stripeAddressEventData) === null || _a === void 0 ? void 0 : _a.value.address.country;
+        }
+        if (stripeStore.stripeAddressEventData &&
+            this.shippingCountry !==
+                stripeStore.stripeAddressEventData.value.address.country) {
+            // reset the shipping country if it's different from the current shipping address
+            this.shippingCountry =
+                stripeStore.stripeAddressEventData.value.address.country;
+        }
         const showBilling = !stripeStore.stripeShippingSameAsBilling;
         // Get theme for the update dialog, inherit from the theme, no from this component theme
         const theme = getZonosStoreTheme(zonosStore.appearance.theme);
@@ -157,7 +171,7 @@ export class ZonosCustomerInfo {
         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", { defaultEmail: (_a = this.defaultAddress) === null || _a === void 0 ? void 0 : _a.email, titleText: translate('Contact') }), h("zonos-address", { defaultAddress: this.defaultAddress, titleText: translate('Address'), type: "shipping" }), h("zonos-checkbox", { class: "zonos--shipping-same-as-billing-cbx", isChecked: stripeStore.stripeShippingSameAsBilling, label: translate('Shipping address same as billing'), onCheckboxSelected: e => {
+        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", { defaultEmail: (_b = this.defaultAddress) === null || _b === void 0 ? void 0 : _b.email, titleText: translate('Contact') }), h("zonos-address", { defaultAddress: this.defaultAddress, titleText: translate('Address'), type: "shipping" }), h("zonos-checkbox", { class: "zonos--shipping-same-as-billing-cbx", 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, 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
@@ -288,6 +302,8 @@ export class ZonosCustomerInfo {
     static get states() {
         return {
             "showErrorBanner": {},
+            "shippingCountry": {},
+            "isCheckingForRestrictedItems": {},
             "isValidatingAddress": {},
             "invalidShippingCharacterList": {},
             "invalidBillingCharacterList": {},

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

@@ -1,5 +1,5 @@
 import { h, Host } from "@stencil/core";
-import { cartStore } from "../../../store/checkout/cart";
+import { cartStore, cartStoreHasOneEligibleItem, } from "../../../store/checkout/cart";
 import { translate } from "../../../store/translationStore";
 import { zonosStore } from "../../../store/zonosStore";
 import { isCheckoutMobile } from "../../../utils/checkout/isCheckoutMobile";
@@ -23,6 +23,7 @@ export class ZonosReview {
         this.isMobile = isCheckoutMobile(this.mobile);
     }
     render() {
+        const total = cartStoreHasOneEligibleItem() ? cartStore.total : 0;
         const titleTextType = this.isMobile ? 'boldSubheader' : 'semiBoldLabel';
         const totalTextType = this.isMobile
             ? 'boldSubheader'
@@ -42,7 +43,7 @@ export class ZonosReview {
                 'zonos--review zonos--elements',
                 this.isMobile && 'mobile',
             ]) }, h("div", { class: "zonos--title" }, h("zonos-text", { textColor: titleTextColor, type: titleTextType }, translate('Pay'), " ", zonosStore.organizationName), renderCollapseIcon()), h("div", { class: "zonos--total-pay" }, h("zonos-text", { type: totalTextType }, formatCurrency({
-            amount: cartStore.total,
+            amount: total,
             currency: cartStore.currency,
         })))));
     }

package/dist/collection/components/store/checkout/cart.js

@@ -17,6 +17,7 @@ const { onChange, reset, state: cartStore, } = createStore(() => ({
     isSelectedShippingGuarantee: false,
     items: [],
     landedCostData: null,
+    restrictedItems: [],
     selectedLandedCost: null,
     selectedShippingOption: null,
     selectedShippingOptionExpectedDate: '',
@@ -73,6 +74,39 @@ const cartStoreGetShippingTransitInfo = (item) => {
         minTransit,
     };
 };
+const getMatchItem = ({ item1, item2, }) => {
+    if (!item1 || !item2) {
+        return false;
+    }
+    return ((item2.sku && item1.sku && item1.sku === item2.sku) ||
+        (item2.description &&
+            item1.description &&
+            item1.description === item2.description) ||
+        (item1.name && item2.name && item1.name === item2.name));
+};
+/**
+ * Check and set restricted items in cart
+ */
+const cartStoreCheckItemRestrictions = (itemsWorkflow) => {
+    log('Checking item restrictions');
+    const mappedRestrictedItems = itemsWorkflow
+        .map(item => {
+        if (!item.restriction) {
+            return null;
+        }
+        const { restriction } = item;
+        const matchedItem = cartStore.items.find(x => getMatchItem({ item1: x, item2: item }));
+        return Object.assign(Object.assign({ matchedItem }, item), { restriction });
+    })
+        .filter(Boolean);
+    cartStore.restrictedItems = mappedRestrictedItems;
+    // remove items that are restricted from cart
+    cartStore.items = cartStore.items.map(item => (Object.assign(Object.assign({}, item), { isRestricted: !!mappedRestrictedItems.find(x => getMatchItem({ item1: x, item2: item })) })));
+    return {
+        cartItems: cartStore.items,
+        restrictedItems: mappedRestrictedItems,
+    };
+};
 const cartStoreReset = () => {
     sessionStorage.removeItem('zonos--checkout-session-id');
     // reset cart store
@@ -95,6 +129,16 @@ const cartStoreApplySubtotals = (subtotals) => {
     cartStore.total = subtotals.total;
     cartStore.currency = subtotals.presentmentCurrencyCode;
 };
+/**
+ * Detect if there are any items in cart that are not restricted and have positive amount, exclude negative amount items
+ */
+const cartStoreHasOneEligibleItem = () => {
+    // filter all items with positive amount
+    const checkItems = cartStore.items.filter(item => item.amount > 0);
+    // only check restricted status for items with positive amount
+    // if there is no item restricted found => all items are restricted
+    return !!checkItems.find(item => !item.isRestricted);
+};
 const cartStoreReCalculateTotal = async ({ currency, itemsAmount, landedCostId, }) => {
     if (landedCostId && cartStore.selectedLandedCost) {
         // update cart total right away if we have landed cost id to avoid order total flickering
@@ -175,11 +219,17 @@ onChange('checkoutSessionId', () => {
     }
     sessionStorage.setItem('zonos--checkout-session-id', cartStore.checkoutSessionId);
 });
-const cartStoreUpdateItems = async (items) => {
+const getCartItemToUse = (items) => items.map(item => (Object.assign(Object.assign({}, item), { isRestricted: false })));
+const cartStoreResetCartItems = () => {
+    // mark all items as not restricted
+    cartStore.items = cartStore.items.map(item => (Object.assign(Object.assign({}, item), { isRestricted: false })));
+    cartStore.restrictedItems = [];
+};
+const cartStoreUpdateItems = async (cartItems) => {
     var _a;
-    cartStore.items = items;
-    const currency = (_a = items.find(Boolean)) === null || _a === void 0 ? void 0 : _a.currencyCode;
-    const total = items.reduce((amt, item) => {
+    cartStore.items = getCartItemToUse(cartItems);
+    const currency = (_a = cartItems.find(Boolean)) === null || _a === void 0 ? void 0 : _a.currencyCode;
+    const total = cartItems.reduce((amt, item) => {
         return amt + item.amount * item.quantity;
     }, 0);
     if (!currency || !total) {
@@ -226,4 +276,4 @@ const cartStoreResetTabItems = () => {
     cartStore.tabItems = Object.assign(Object.assign({}, cartStore.tabItems), { 'customer-info': Object.assign(Object.assign({}, cartStore.tabItems['customer-info']), { isDone: false }), payment: Object.assign(Object.assign({}, cartStore.tabItems.payment), { isDone: false }), shipping: Object.assign(Object.assign({}, cartStore.tabItems.shipping), { isDone: false }) });
     cartStoreResetSelectedShippingOption();
 };
-export { cartStore, cartStoreApplySubtotals, cartStoreGetShippingTransitInfo, cartStoreNextStep, cartStoreReCalculateTotal, cartStoreReset, cartStoreResetTabItems, cartStoreUpdateItems, cartStoreUpdateSelectedShippingOption, cartStoreUpdateToErrorState, };
+export { cartStore, cartStoreApplySubtotals, cartStoreCheckItemRestrictions, cartStoreGetShippingTransitInfo, cartStoreHasOneEligibleItem, cartStoreNextStep, cartStoreReCalculateTotal, cartStoreReset, cartStoreResetCartItems, cartStoreResetTabItems, cartStoreUpdateItems, cartStoreUpdateSelectedShippingOption, cartStoreUpdateToErrorState, };

package/dist/collection/components/store/checkout/stripe.js

@@ -1,5 +1,5 @@
 import { createStore } from "@stencil/store";
-import { cartStore, cartStoreApplySubtotals, } from "./cart";
+import { cartStore, cartStoreApplySubtotals, cartStoreCheckItemRestrictions, cartStoreResetCartItems, } from "./cart";
 import { localizationStore } from "../hello/localization";
 import { translate } from "../translationStore";
 import { zonosStore } from "../zonosStore";
@@ -193,7 +193,9 @@ const stripeStorePrefetchLandedCost = async () => {
         try {
             const abortController = new AbortController();
             stripeStore.fetchingLandedCostAbordController = abortController;
-            const { checkoutSessionWorkflow, landedCostCalculateWorkflow, shipmentRatingCalculateWorkflow, } = await calculateLandedCost(abortController);
+            // Reset cart items to non-restricted state and restricted item list
+            cartStoreResetCartItems();
+            const { checkoutSessionWorkflow, itemCreateWorkflow, landedCostCalculateWorkflow, shipmentRatingCalculateWorkflow, } = await calculateLandedCost(abortController);
             // reset abort controller after we are done
             stripeStore.fetchingLandedCostAbordController = null;
             // update cart store with landed cost info
@@ -212,6 +214,8 @@ const stripeStorePrefetchLandedCost = async () => {
             const subtotals = !!firstLandedCostData
                 ? firstLandedCostData.subtotals
                 : null;
+            // check and update cart items with restrictions
+            cartStoreCheckItemRestrictions(itemCreateWorkflow);
             if (subtotals) {
                 // prefetch landed cost will not update shipping and taxes since we haven't selected shipping method yet
                 cartStoreApplySubtotals({

package/dist/collection/components/store/hello/localization.js

@@ -134,7 +134,7 @@ const initLocalizationStore = async () => {
     const overrideLocale = getOverrideLocale();
     localizationStore.selectedLocale = overrideLocale || locale || 'en';
     translationStoreUpdateLanguage(localizationStore.selectedLocale);
-    const devSites = ['dev.elements', 'dev.dashboard'];
+    const devSites = ['dev.storybook.elements', 'dev.elements', 'dev.dashboard'];
     // If the country code is not set, set it to the US for development (vercel can't get geo country in dev)
     if (!localizationStore.selectedCountryCode &&
         devSites.some(site => window.location.origin.includes(site))) {

package/dist/collection/components/store/translationStore/strings.arabic.js

@@ -86,6 +86,9 @@ export const stringsArabic = {
     Guaranteed: {
         value: 'مضمون',
     },
+    Hide: {
+        value: 'اخفِ',
+    },
     'Keep shopping': {
         value: 'متابعة التسوق',
     },
@@ -182,6 +185,9 @@ export const stringsArabic = {
     'Shipping method': {
         value: 'طريقة الشحن',
     },
+    Show: {
+        value: 'عرض',
+    },
     'Something went wrong.': {
         value: 'حدث خطأ ما.',
     },
@@ -197,6 +203,9 @@ export const stringsArabic = {
     'Taxes will apply to all orders': {
         value: 'ستنطبق الضرائب على جميع الطلبات',
     },
+    'The following items are unable to be shipped to your country and are not included in your cart total.': {
+        value: 'العناصر التالية لا يمكن شحنها إلى بلدك ولا تُضاف إلى إجمالي سلة مشترياتك.',
+    },
     "There's been an error creating your checkout session. Please reload and try again or contact support if the error persists": {
         value: 'حدث خطأ في إنشاء جلسة الخروج الخاصة بك. يرجى إعادة التحميل والمحاولة مرة أخرى أو الاتصال بالدعم إذا استمر الخطأ',
     },
@@ -245,6 +254,9 @@ export const stringsArabic = {
     'duty free': {
         value: 'معفى من الرسوم',
     },
+    'restricted items': {
+        value: 'عناصر مقيدة',
+    },
     'tax free': {
         value: 'معفى من الضرائب',
     },

package/dist/collection/components/store/translationStore/strings.base.js

@@ -86,6 +86,9 @@ export const stringsBase = {
     Guaranteed: {
         value: 'Guaranteed',
     },
+    Hide: {
+        value: 'Hide',
+    },
     'Keep shopping': {
         value: 'Keep shopping',
     },
@@ -182,6 +185,9 @@ export const stringsBase = {
     'Shipping method': {
         value: 'Shipping method',
     },
+    Show: {
+        value: 'Show',
+    },
     'Something went wrong.': {
         value: 'Something went wrong.',
     },
@@ -197,6 +203,9 @@ export const stringsBase = {
     'Taxes will apply to all orders': {
         value: 'Taxes will apply to all orders',
     },
+    'The following items are unable to be shipped to your country and are not included in your cart total.': {
+        value: 'The following items are unable to be shipped to your country and are not included in your cart total.',
+    },
     "There's been an error creating your checkout session. Please reload and try again or contact support if the error persists": {
         value: "There's been an error creating your checkout session. Please reload and try again or contact support if the error persists",
     },
@@ -245,6 +254,9 @@ export const stringsBase = {
     'duty free': {
         value: 'duty free',
     },
+    'restricted items': {
+        value: 'restricted items',
+    },
     'tax free': {
         value: 'tax free',
     },

package/dist/collection/components/store/translationStore/strings.chinese.js

@@ -86,6 +86,9 @@ export const stringsChinese = {
     Guaranteed: {
         value: '保证',
     },
+    Hide: {
+        value: '隐藏',
+    },
     'Keep shopping': {
         value: '继续购物',
     },
@@ -182,6 +185,9 @@ export const stringsChinese = {
     'Shipping method': {
         value: '运输方式',
     },
+    Show: {
+        value: '显示',
+    },
     'Something went wrong.': {
         value: '出了些问题。',
     },
@@ -197,6 +203,9 @@ export const stringsChinese = {
     'Taxes will apply to all orders': {
         value: '税款将适用于所有订单',
     },
+    'The following items are unable to be shipped to your country and are not included in your cart total.': {
+        value: '以下商品无法运送至您的国家，并且不包括在您购物车的总额中。',
+    },
     "There's been an error creating your checkout session. Please reload and try again or contact support if the error persists": {
         value: '创建您的结账会话时出现错误。如果错误仍然存在，请重新加载页面并重试，或联系支持',
     },
@@ -245,6 +254,9 @@ export const stringsChinese = {
     'duty free': {
         value: '免征关税',
     },
+    'restricted items': {
+        value: '限制物品',
+    },
     'tax free': {
         value: '免税',
     },

package/dist/collection/components/store/translationStore/strings.danish.js

@@ -86,6 +86,9 @@ export const stringsDanish = {
     Guaranteed: {
         value: 'Garanteret',
     },
+    Hide: {
+        value: 'Skjul',
+    },
     'Keep shopping': {
         value: 'Fortsæt med at handle',
     },
@@ -182,6 +185,9 @@ export const stringsDanish = {
     'Shipping method': {
         value: 'Leveringsmetode',
     },
+    Show: {
+        value: 'Vis',
+    },
     'Something went wrong.': {
         value: 'Noget gik galt.',
     },
@@ -197,6 +203,9 @@ export const stringsDanish = {
     'Taxes will apply to all orders': {
         value: 'Skatter vil gælde for alle ordrer',
     },
+    'The following items are unable to be shipped to your country and are not included in your cart total.': {
+        value: 'De følgende varer kan ikke sendes til dit land og er ikke inkluderet i din kurvs total.',
+    },
     "There's been an error creating your checkout session. Please reload and try again or contact support if the error persists": {
         value: 'Der opstod en fejl under oprettelsen af din betalingssession. Genindlæs venligst og prøv igen eller kontakt support, hvis fejlen fortsætter',
     },
@@ -245,6 +254,9 @@ export const stringsDanish = {
     'duty free': {
         value: 'toldfrit',
     },
+    'restricted items': {
+        value: 'begrænsede genstande',
+    },
     'tax free': {
         value: 'skattefrit',
     },