ui.shipaid.com 0.3.146 → 0.3.148

package/dist/widget.es.js

@@ -1,6 +1,19 @@
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+function getIdFromShopifyGid(gid) {
+  var _a;
+  return ((_a = gid == null ? void 0 : gid.match(/\d+/)) == null ? void 0 : _a[0]) ?? null;
+}
+const normalizeVariantId$1 = (value) => {
+  if (value === null || value === void 0) return null;
+  if (typeof value === "number") return String(value);
+  if (typeof value === "string") {
+    const numericId = getIdFromShopifyGid(value);
+    return numericId ?? value;
+  }
+  return null;
+};
 const getExcludedProducts = (store) => {
   const excludedProductSkus = Array.isArray(
     store == null ? void 0 : store.excludedProductSkus
@@ -28,26 +41,43 @@ function calculateProtectionTotal(store, protectionProduct, cart) {
     throw new Error("Tried to find protection variant, but protection settings for this store are missing.");
   }
   const { excludedProductSkus, excludedProductTags, excludedProductIds } = getExcludedProducts(store);
+  const excludedVariantIdSet = new Set(
+    excludedProductIds.map((id) => String(id))
+  );
+  const protectionVariantIdSet = new Set(
+    ((protectionProduct == null ? void 0 : protectionProduct.variants) ?? []).map((variant) => normalizeVariantId$1(variant == null ? void 0 : variant.id)).filter((id) => Boolean(id))
+  );
+  const isProtectionVariant = (item) => {
+    const normalizedId = normalizeVariantId$1(item.variant_id);
+    if (!normalizedId) return false;
+    if (protectionVariantIdSet.has(normalizedId)) return true;
+    return protectionVariantIdSet.has(String(normalizedId));
+  };
   const isItemExcluded = (item) => {
+    if (isProtectionVariant(item)) return false;
     if (item.isVirtualProduct) {
       return true;
-    } else if (item.sku && excludedProductSkus.includes(item.sku.trim())) {
+    }
+    if (item.sku && excludedProductSkus.includes(item.sku.trim())) {
       return true;
-    } else if (item.tags && item.tags.some((t2) => excludedProductTags.includes(t2.toLowerCase().trim()))) {
+    }
+    if (item.tags && item.tags.some((t2) => excludedProductTags.includes(t2.toLowerCase().trim()))) {
       return true;
-    } else if (item.variant_id && excludedProductIds.includes(item.variant_id)) {
+    }
+    const normalizedId = normalizeVariantId$1(item.variant_id);
+    if (normalizedId && excludedVariantIdSet.has(normalizedId)) {
       return true;
     }
     return false;
   };
+  const protectionVariantsInCart = ((_a = cart.items) == null ? void 0 : _a.filter((item) => isProtectionVariant(item))) ?? [];
+  const protectionVariantsInCartTotal = protectionVariantsInCart.reduce(
+    (total, item) => total + (Number(item.final_line_price) || 0),
+    0
+  );
   const itemTotal = (cart.items ?? []).reduce((total, item) => {
-    return isItemExcluded(item) ? total - item.final_line_price : total;
-  }, cart.total_price || 0);
-  const protectionVariantsInCart = ((_a = cart.items) == null ? void 0 : _a.filter((item) => {
-    var _a2;
-    return (_a2 = protectionProduct == null ? void 0 : protectionProduct.variants) == null ? void 0 : _a2.some((variant) => variant.id === item.variant_id);
-  })) ?? [];
-  const protectionVariantsInCartTotal = protectionVariantsInCart.reduce((total, item) => total + item.final_line_price, 0);
+    return isItemExcluded(item) ? total - (Number(item.final_line_price) || 0) : total;
+  }, Number(cart.total_price) || 0);
   const cartTotal = itemTotal - protectionVariantsInCartTotal;
   const allowZeroCartValueProtection = (_b = store.widgetConfigurations) == null ? void 0 : _b.allowZeroCartValueProtection;
   if (!allowZeroCartValueProtection) {
@@ -98,10 +128,6 @@ function findProtectionVariant(store, protectionProduct, protectionFee) {
   }
   return matchingVariant;
 }
-function getIdFromShopifyGid(gid) {
-  var _a;
-  return ((_a = gid == null ? void 0 : gid.match(/\d+/)) == null ? void 0 : _a[0]) ?? null;
-}
 const common = { calculateProtectionTotal, findProtectionVariant };
 /**
  * @license
@@ -3101,6 +3127,7 @@ var SHIPAID_EVENTS = /* @__PURE__ */ ((SHIPAID_EVENTS2) => {
 })(SHIPAID_EVENTS || {});
 var EXTERNAL_EVENTS = /* @__PURE__ */ ((EXTERNAL_EVENTS2) => {
   EXTERNAL_EVENTS2["CART_UPDATE"] = "cart:update";
+  EXTERNAL_EVENTS2["CART_UPDATED"] = "cart:updated";
   EXTERNAL_EVENTS2["VARIANT_CHANGE"] = "variant:change";
   return EXTERNAL_EVENTS2;
 })(EXTERNAL_EVENTS || {});
@@ -3479,6 +3506,93 @@ const openCarousel = (from) => {
   } catch {
   }
 };
+const ensureLearnMoreCarousel = (store) => {
+  var _a, _b;
+  try {
+    const existing = document.querySelector("shipaid-learn-more-carousel");
+    if (existing) return;
+    const el = document.createElement("shipaid-learn-more-carousel");
+    const isGreenEnabled = Boolean((_a = store == null ? void 0 : store.greenProtection) == null ? void 0 : _a.enabled);
+    const isFreeGiftEnabled = Boolean((_b = store == null ? void 0 : store.freeGifts) == null ? void 0 : _b.enabled);
+    if (isGreenEnabled) el.setAttribute("green-protection", "true");
+    if (isFreeGiftEnabled) el.setAttribute("free-gift", "true");
+    el.setAttribute("carousel-state", "close");
+    document.body.appendChild(el);
+  } catch {
+  }
+};
+const refreshShopifyCartUI = async () => {
+  try {
+    const sectionIds = ["cart-drawer", "cart-icon-bubble", "main-cart-items"];
+    const url = `/?sections=${encodeURIComponent(sectionIds.join(","))}`;
+    const res = await fetch(url, { credentials: "same-origin" });
+    if (!res.ok) return;
+    const htmlById = await res.json().catch(() => null);
+    if (!htmlById || typeof htmlById !== "object") return;
+    for (const id of Object.keys(htmlById)) {
+      const html = htmlById[id];
+      if (typeof html !== "string") continue;
+      const tmp = document.createElement("div");
+      tmp.innerHTML = html;
+      if (id === "cart-drawer") {
+        try {
+          const newDrawer = tmp.querySelector("cart-drawer");
+          const oldDrawer = document.querySelector("cart-drawer");
+          if (newDrawer && oldDrawer) {
+            const shouldBeEmpty = newDrawer.classList.contains("is-empty");
+            if (shouldBeEmpty) oldDrawer.classList.add("is-empty");
+            else oldDrawer.classList.remove("is-empty");
+          }
+        } catch {
+        }
+        try {
+          const newDrawerItems = tmp.querySelector("cart-drawer-items");
+          const oldDrawerItems = document.querySelector("cart-drawer cart-drawer-items, .cart-drawer cart-drawer-items");
+          if (newDrawerItems && oldDrawerItems) {
+            oldDrawerItems.outerHTML = newDrawerItems.outerHTML;
+          }
+        } catch {
+        }
+        const newItems = tmp.querySelector("#CartDrawer-CartItems");
+        const oldItems = document.getElementById("CartDrawer-CartItems");
+        if (newItems && oldItems) {
+          oldItems.outerHTML = newItems.outerHTML;
+        }
+        const newFooter = tmp.querySelector(".cart-drawer__footer");
+        const oldFooter = document.querySelector(".cart-drawer .cart-drawer__footer");
+        if (newFooter && oldFooter) {
+          oldFooter.outerHTML = newFooter.outerHTML;
+        }
+        const newCtas = tmp.querySelector(".cart__ctas");
+        const oldCtas = document.querySelector(".cart-drawer .cart__ctas");
+        if (newCtas && oldCtas) {
+          oldCtas.outerHTML = newCtas.outerHTML;
+        }
+        continue;
+      }
+      if (id === "main-cart-items") {
+        const newMainItems = tmp.querySelector("#main-cart-items");
+        const oldMainItems = document.getElementById("main-cart-items");
+        if (newMainItems && oldMainItems) {
+          oldMainItems.outerHTML = newMainItems.outerHTML;
+        } else {
+          const section = document.getElementById("shopify-section-main-cart-items");
+          if (section) section.outerHTML = html;
+        }
+        continue;
+      }
+      if (id === "cart-icon-bubble") {
+        const newBubble = tmp.querySelector("#cart-icon-bubble, [data-cart-count-bubble]");
+        const oldBubble = document.querySelector("#cart-icon-bubble, [data-cart-count-bubble]");
+        if (newBubble && oldBubble) {
+          oldBubble.replaceWith(newBubble);
+        }
+        continue;
+      }
+    }
+  } catch {
+  }
+};
 var __defProp$2 = Object.defineProperty;
 var __decorateClass$2 = (decorators, target, key, kind) => {
   var result = void 0;
@@ -3527,7 +3641,39 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     };
     this.intervalId = null;
     this._sellingPlanId = null;
-    this._pendingLearnMoreSource = null;
+    this._isUpdatingShipAid = false;
+    this._lastCartEventAt = 0;
+    this._isReplacingCartSections = false;
+    this._onShipAidCartEvent = (event) => {
+      var _a2, _b2;
+      if (((_b2 = (_a2 = event == null ? void 0 : event.detail) == null ? void 0 : _a2.data) == null ? void 0 : _b2.source) === "shipaid-widget") return;
+      if (this._isUpdatingShipAid) return;
+      const now = Date.now();
+      if (now - this._lastCartEventAt < 500) return;
+      this._lastCartEventAt = now;
+      try {
+        this.updateCart().catch(() => {
+        });
+      } catch {
+      }
+    };
+    this._onShipAidInternalCartUpdated = (event) => {
+      var _a2, _b2, _c2, _d;
+      const src = ((_b2 = (_a2 = event == null ? void 0 : event.detail) == null ? void 0 : _a2.data) == null ? void 0 : _b2.source) || ((_c2 = event == null ? void 0 : event.detail) == null ? void 0 : _c2.source);
+      if (src === "shipaid-widget") return;
+      if (this._isUpdatingShipAid) return;
+      const providedCart = (_d = event == null ? void 0 : event.detail) == null ? void 0 : _d.cart;
+      try {
+        if (providedCart) {
+          this.updateCart(providedCart).catch(() => {
+          });
+        } else {
+          this.updateCart().catch(() => {
+          });
+        }
+      } catch {
+      }
+    };
     this._handleHelpClick = (event) => {
       if (event) event.preventDefault();
       this._toggleBenefits();
@@ -3614,8 +3760,7 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     }
   }
   _openLearnMore(source) {
-    this._popup = "learn-more";
-    this._pendingLearnMoreSource = source;
+    openCarousel(source);
     if (this.persistPopup) {
       this.setPopupKey();
     }
@@ -3727,11 +3872,16 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
   async _handleRefresh(input) {
     const isCart = Reflect.has(input, "items");
     if (this.shouldRefreshOnUpdate) return window.location.reload();
-    if (!isCart) await this.updateCart();
+    if (isCart) {
+      await this.updateCart(input, { dispatchExternalEvents: true });
+    } else {
+      await this.updateCart(void 0, { dispatchExternalEvents: true });
+    }
     this._dispatchEvent(SHIPAID_EVENTS.CART_UPDATED, {
       protection: this._hasProtectionInCart,
       cart: isCart ? input : this._cart,
-      lineItem: !isCart ? input : this._protectionCartItem
+      lineItem: !isCart ? input : this._protectionCartItem,
+      data: { source: "shipaid-widget" }
     });
   }
   /** Given the current order, it calculates the protection total according to the store protection settings. */
@@ -3995,9 +4145,28 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     return this._hasProtectionInCart;
   }
   /** Update the internal cart, which will trigger any protection fee updates */
-  async updateCart(cart) {
+  async updateCart(cart, options) {
     if (!cart) cart = await this._fetchCart();
     this._cart = cart;
+    const shouldDispatchExternal = (options == null ? void 0 : options.dispatchExternalEvents) ?? false;
+    if (shouldDispatchExternal) {
+      try {
+        document.dispatchEvent(new CustomEvent(EXTERNAL_EVENTS.CART_UPDATE, {
+          detail: { data: { source: "shipaid-widget" }, cart }
+        }));
+        window.dispatchEvent(new CustomEvent(EXTERNAL_EVENTS.CART_UPDATE, {
+          detail: { data: { source: "shipaid-widget" }, cart }
+        }));
+      } catch {
+      }
+    }
+    try {
+      this._isReplacingCartSections = true;
+      await refreshShopifyCartUI();
+    } catch {
+    } finally {
+      this._isReplacingCartSections = false;
+    }
   }
   async addCartProtectionVariant() {
     var _a, _b;
@@ -4116,12 +4285,28 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
   /** Add ShipAid shipping protection. */
   async addProtection() {
     var _a, _b;
+    if (this._isUpdatingShipAid) {
+      return;
+    }
     try {
+      this._isUpdatingShipAid = true;
+      this._disableCheckoutButtons();
       if (!this._store) throw new Error("Store has not been loaded.");
-      if (!((_a = this._cart) == null ? void 0 : _a.items)) throw new Error("Cart has not been loaded.");
-      if (!((_b = this._protectionVariant) == null ? void 0 : _b.id)) {
+      if (!((_a = this._protectionVariant) == null ? void 0 : _a.id)) {
         throw new Error("No protection variant found.");
       }
+      this._cart = await this._fetchCart();
+      if (!((_b = this._cart) == null ? void 0 : _b.items)) throw new Error("Cart has not been loaded.");
+      const existingProtection = this._cart.items.find((item) => {
+        var _a2, _b2;
+        return (_b2 = (_a2 = this._protectionProduct) == null ? void 0 : _a2.variants) == null ? void 0 : _b2.some(
+          (variant) => variant.id === item.variant_id
+        );
+      });
+      if (existingProtection) {
+        this._hasProtectionInCart = true;
+        return;
+      }
       this._setState("loading");
       const cart = await this.addCartProtectionVariant();
       await this._handleRefresh(cart);
@@ -4132,11 +4317,15 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     } finally {
       this._cart = await this._fetchCart();
       this._setState("success");
+      this._isUpdatingShipAid = false;
+      this._enableCheckoutButtons();
     }
   }
   /** Remove ShipAid shipping protection. */
   async removeProtection() {
     try {
+      this._isUpdatingShipAid = true;
+      this._disableCheckoutButtons();
       if (!this._store) throw new Error("Store has not been loaded.");
       if (!this._protectionCartItem) {
         throw new Error("Protection product not found.");
@@ -4155,6 +4344,8 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     } finally {
       this._cart = await this._fetchCart();
       this._setState("success");
+      this._isUpdatingShipAid = false;
+      this._enableCheckoutButtons();
     }
   }
   /** Try adding ShipAid shipping protection during polling if applicable */
@@ -4162,6 +4353,7 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     var _a, _b, _c, _d, _e, _f;
     if (!((_a = this._store) == null ? void 0 : _a.widgetAutoOptIn) || this.useShipAidCheckout) return;
     if (!((_b = this._cart) == null ? void 0 : _b.items) || !((_c = this._cart) == null ? void 0 : _c.item_count)) return;
+    if (this._isUpdatingShipAid) return;
     const protectionCartItemIndex = (_d = this._cart.items) == null ? void 0 : _d.findIndex((item) => {
       var _a2, _b2;
       return (_b2 = (_a2 = this._protectionProduct) == null ? void 0 : _a2.variants) == null ? void 0 : _b2.some(
@@ -4187,46 +4379,68 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     }
   }
   async handleMultipleProtectionVariants() {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c;
     if (!((_a = this._cart) == null ? void 0 : _a.items) || !((_b = this._cart) == null ? void 0 : _b.item_count)) return;
-    let count = 0;
+    const protectionItems = [];
     (_c = this._cart.items) == null ? void 0 : _c.forEach((item) => {
       var _a2, _b2;
       const isProtectionItem = (_b2 = (_a2 = this._protectionProduct) == null ? void 0 : _a2.variants) == null ? void 0 : _b2.some(
         (variant) => variant.id === item.variant_id
       );
-      if (isProtectionItem) count++;
+      if (isProtectionItem) {
+        protectionItems.push(item);
+      }
     });
-    if (count > 1) {
-      const protectionCartItemIndex = (_d = this._cart.items) == null ? void 0 : _d.findIndex((item) => {
-        var _a2, _b2;
-        return (_b2 = (_a2 = this._protectionProduct) == null ? void 0 : _a2.variants) == null ? void 0 : _b2.some(
-          (variant) => variant.id === item.variant_id
-        );
+    if (protectionItems.length > 1) {
+      for (let i3 = 1; i3 < protectionItems.length; i3++) {
+        await this.updateCartProtectionVariant(0, protectionItems[i3]);
+      }
+      this._cart = await this._fetchCart();
+      return await this._handleRefresh(this._cart);
+    }
+  }
+  /** Disable checkout buttons while updating protection */
+  _disableCheckoutButtons() {
+    var _a, _b;
+    try {
+      const providedSelector = (_b = (_a = this._store) == null ? void 0 : _a.widgetConfigurations) == null ? void 0 : _b.checkoutButtonSelector;
+      const selectors = providedSelector ? providedSelector.split(",").map((s3) => s3.trim()).filter(Boolean) : DEFAULT_CHECKOUT_SELECTORS;
+      const buttons = /* @__PURE__ */ new Set();
+      selectors.forEach((selector) => {
+        try {
+          document.querySelectorAll(selector).forEach((btn) => {
+            buttons.add(btn);
+          });
+        } catch (e3) {
+        }
       });
-      const protectionCartItem = (_e = this._cart) == null ? void 0 : _e.items[protectionCartItemIndex];
-      const cart = await this.updateCartProtectionVariant(
-        0,
-        protectionCartItem
-      );
-      return await this._handleRefresh(cart);
+      buttons.forEach((button) => {
+        button.setAttribute("disabled", "true");
+        button.style.opacity = "0.6";
+        button.style.pointerEvents = "none";
+        button.setAttribute("data-shipaid-disabled", "true");
+      });
+    } catch (error) {
+      console.error("[ShipAid] Error disabling checkout buttons:", error);
+    }
+  }
+  /** Re-enable checkout buttons after updating protection */
+  _enableCheckoutButtons() {
+    try {
+      const buttons = document.querySelectorAll('[data-shipaid-disabled="true"]');
+      buttons.forEach((button) => {
+        button.removeAttribute("disabled");
+        button.style.opacity = "";
+        button.style.pointerEvents = "";
+        button.removeAttribute("data-shipaid-disabled");
+      });
+    } catch (error) {
+      console.error("[ShipAid] Error enabling checkout buttons:", error);
     }
   }
   /** Templates */
   learnMorePopupTemplate() {
-    var _a, _b, _c, _d;
-    const carousel = document.querySelector("shipaid-learn-more-carousel");
-    const isGreenEnabled = Boolean((_b = (_a = this._store) == null ? void 0 : _a.greenProtection) == null ? void 0 : _b.enabled);
-    const isFreeGiftEnabled = Boolean((_d = (_c = this._store) == null ? void 0 : _c.freeGifts) == null ? void 0 : _d.enabled);
-    if (carousel) return;
-    return x`
-      <shipaid-learn-more-carousel
-        carousel-state=${this._popup === "learn-more" ? "open" : "close"}
-        free-gift=${isFreeGiftEnabled}
-        green-protection=${isGreenEnabled}
-      >
-      </shipaid-learn-more-carousel>
-    `;
+    return null;
   }
   confirmationPopupTemplate() {
     return x`
@@ -4806,15 +5020,14 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
   renderPopups() {
     if (this.persistPopup) {
       this._popup = this.shouldPersistPopup();
-      if (this._popup === "learn-more" && !this._pendingLearnMoreSource) {
-        this._pendingLearnMoreSource = "shipaid-widget";
+      if (this._popup === "learn-more") {
+        openCarousel("shipaid-widget");
+        this._popup = null;
       }
     }
     switch (this._popup) {
       case "confirmation":
         return this.confirmationPopupTemplate();
-      case "learn-more":
-        return this.learnMorePopupTemplate();
       default:
         return null;
     }
@@ -4959,57 +5172,103 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     await use(this.lang);
     this.hasLoadedStrings = true;
     this.fetchInterceptorCleanup = interceptFetch(async (args, promise) => {
-      var _a, _b, _c, _d;
+      var _a, _b;
       if ((_b = (_a = args[1]) == null ? void 0 : _a.headers) == null ? void 0 : _b["X-ShipAid"]) {
         return;
       }
       if (!args[0].startsWith("/cart/change") && !args[0].startsWith("/cart/update")) {
         return;
       }
-      const buttonSelector = ((_d = (_c = this._store) == null ? void 0 : _c.widgetConfigurations) == null ? void 0 : _d.checkoutButtonSelector) || 'button[type="submit"][name="checkout"][form="cart"]';
-      const button = document.querySelector(buttonSelector);
-      console.log("q", button);
-      if (!button) {
+      if (this._isUpdatingShipAid) {
         return;
       }
-      button.setAttribute("disabled", "true");
-      console.debug("button", "t");
       try {
+        this._isUpdatingShipAid = true;
+        this._disableCheckoutButtons();
         await promise;
         await this.updateCart();
-        await this.updateProtection();
+        await this.updateProtection(true);
+      } catch (error) {
+        console.error("[ShipAid] Interceptor error:", error);
       } finally {
-        button.removeAttribute("disabled");
-        console.debug("button", "f");
+        this._isUpdatingShipAid = false;
+        this._enableCheckoutButtons();
       }
     });
+    try {
+      document.addEventListener(EXTERNAL_EVENTS.CART_UPDATE, this._onShipAidCartEvent);
+    } catch {
+    }
+    try {
+      window.addEventListener(EXTERNAL_EVENTS.CART_UPDATE, this._onShipAidCartEvent);
+    } catch {
+    }
+    try {
+      document.addEventListener(SHIPAID_EVENTS.CART_UPDATED, this._onShipAidInternalCartUpdated);
+    } catch {
+    }
   }
   disconnectedCallback() {
     var _a;
     super.disconnectedCallback();
     (_a = this.fetchInterceptorCleanup) == null ? void 0 : _a.call(this);
+    try {
+      document.removeEventListener(EXTERNAL_EVENTS.CART_UPDATE, this._onShipAidCartEvent);
+    } catch {
+    }
+    try {
+      window.removeEventListener(EXTERNAL_EVENTS.CART_UPDATE, this._onShipAidCartEvent);
+    } catch {
+    }
+    try {
+      document.removeEventListener(SHIPAID_EVENTS.CART_UPDATED, this._onShipAidInternalCartUpdated);
+    } catch {
+    }
   }
-  async updateProtection() {
-    var _a, _b, _c, _d;
+  async updateProtection(force = false) {
+    var _a, _b, _c;
     this._cartLastUpdated = /* @__PURE__ */ new Date();
     if (!((_a = this._cart) == null ? void 0 : _a.items)) return;
-    const protectionCartItemIndex = (_b = this._cart.items) == null ? void 0 : _b.findIndex((item) => {
+    if (this._isUpdatingShipAid && !force) {
+      return;
+    }
+    const allProtectionItems = this._cart.items.filter((item) => {
       var _a2, _b2;
       return (_b2 = (_a2 = this._protectionProduct) == null ? void 0 : _a2.variants) == null ? void 0 : _b2.some(
         (variant) => variant.id === item.variant_id
       );
     });
-    const protectionCartItem = (_c = this._cart) == null ? void 0 : _c.items[protectionCartItemIndex];
+    if (allProtectionItems.length > 1) {
+      try {
+        this._isUpdatingShipAid = true;
+        this._disableCheckoutButtons();
+        for (let i3 = 1; i3 < allProtectionItems.length; i3++) {
+          await this.updateCartProtectionVariant(0, allProtectionItems[i3]);
+          await new Promise((resolve) => setTimeout(resolve, 100));
+        }
+        this._cart = await this._fetchCart();
+      } finally {
+        this._isUpdatingShipAid = false;
+        this._enableCheckoutButtons();
+      }
+    }
+    const protectionCartItemIndex = ((_b = this._cart.items) == null ? void 0 : _b.findIndex((item) => {
+      var _a2, _b2;
+      return (_b2 = (_a2 = this._protectionProduct) == null ? void 0 : _a2.variants) == null ? void 0 : _b2.some(
+        (variant) => variant.id === item.variant_id
+      );
+    })) ?? -1;
+    const protectionCartItem = protectionCartItemIndex >= 0 && this._cart.items ? this._cart.items[protectionCartItemIndex] : void 0;
     this._hasProtectionInCart = !!protectionCartItem;
     if (!this._store) return;
     const protectionFee = await this.calculateProtectionTotal(this._cart);
     if (this._cart.item_count > 0 && !!protectionCartItem && (this._cart.total_price === (protectionCartItem == null ? void 0 : protectionCartItem.final_line_price) || !protectionFee)) {
-      const cart2 = await this.updateCartProtectionVariant(
+      const cart = await this.updateCartProtectionVariant(
         0,
         protectionCartItem
       );
       sessionStorage.removeItem(LOCAL_STORAGE_KEY);
-      return await this._handleRefresh(cart2);
+      return await this._handleRefresh(cart);
     }
     const protectionVariant = this._findProtectionVariant(protectionFee);
     if (!protectionFee) {
@@ -5026,7 +5285,7 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
       logger.error("No matching protection variant found.");
       return;
     }
-    if (!((_d = this._protectionVariant) == null ? void 0 : _d.id)) {
+    if (!((_c = this._protectionVariant) == null ? void 0 : _c.id)) {
       this._shouldShowWidget = false;
       return;
     }
@@ -5034,7 +5293,7 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
       this._sellingPlanId = await this.getSubscription(this._cart);
     }
     if (!protectionCartItem) return;
-    if (this.supportSubscriptions && !this.useShipAidCheckout) {
+    if (this.supportSubscriptions && !this.useShipAidCheckout && this._cart.items) {
       const itemWithSubscription = this._cart.items.find(
         (item) => {
           var _a2;
@@ -5050,38 +5309,60 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
         shouldUpdateSubscription = false;
       }
       if (shouldUpdateSubscription) {
-        const cart2 = await this.updateCartProtectionVariant(
-          1,
-          protectionCartItem
-        );
-        await this._handleRefresh(cart2);
+        try {
+          this._isUpdatingShipAid = true;
+          this._disableCheckoutButtons();
+          const cart = await this.updateCartProtectionVariant(
+            1,
+            protectionCartItem
+          );
+          await this._handleRefresh(cart);
+        } finally {
+          this._isUpdatingShipAid = false;
+          this._enableCheckoutButtons();
+        }
       }
     }
-    if (protectionVariant.id === protectionCartItem.variant_id) {
+    if (protectionCartItem && protectionVariant.id === protectionCartItem.variant_id) {
       this._protectionCartItem = {
         ...protectionCartItem,
         index: protectionCartItemIndex,
         position: protectionCartItemIndex + 1
       };
       if (protectionCartItem.quantity === 1) return;
-      const cart2 = await this.updateCartProtectionVariant(
-        1,
-        protectionCartItem
+      try {
+        this._isUpdatingShipAid = true;
+        this._disableCheckoutButtons();
+        const cart = await this.updateCartProtectionVariant(
+          1,
+          protectionCartItem
+        );
+        this._handleRefreshCart();
+        await this._handleRefresh(cart);
+      } finally {
+        this._isUpdatingShipAid = false;
+        this._enableCheckoutButtons();
+      }
+      return;
+    }
+    try {
+      this._isUpdatingShipAid = true;
+      this._disableCheckoutButtons();
+      const updatePayload = {
+        updates: {
+          [protectionCartItem.variant_id]: 0,
+          [protectionVariant.id]: 1
+        }
+      };
+      const cart = await this._fetch.post(
+        "/cart/update.js",
+        updatePayload
       );
-      this._handleRefreshCart();
-      return await this._handleRefresh(cart2);
+      await this.updateCart(cart, { dispatchExternalEvents: true });
+    } finally {
+      this._isUpdatingShipAid = false;
+      this._enableCheckoutButtons();
     }
-    const updatePayload = {
-      updates: {
-        [protectionCartItem.variant_id]: 0,
-        [protectionVariant.id]: 1
-      }
-    };
-    const cart = await this._fetch.post(
-      "/cart/update.js",
-      updatePayload
-    );
-    await this._handleRefresh(cart);
   }
   render() {
     useOnce(this, async () => {
@@ -5139,6 +5420,7 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
         return;
       }
       this._hasFinishedSetup = true;
+      ensureLearnMoreCarousel(this._store);
       this._dispatchEvent(SHIPAID_EVENTS.LOADED, this._store);
       setTimeout(async () => {
         var _a2, _b2, _c2, _d2;
@@ -5200,24 +5482,6 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
       this,
       () => {
         D(this.renderPopups(), document.body);
-        if (this._popup === "learn-more") {
-          const source = this._pendingLearnMoreSource ?? "shipaid-widget";
-          this._pendingLearnMoreSource = null;
-          requestAnimationFrame(() => {
-            try {
-              window.dispatchEvent(
-                new CustomEvent(SHIPAID_EVENTS.LEARN_MORE_OPENED, {
-                  detail: { source }
-                })
-              );
-            } catch (error) {
-              const message = error instanceof Error ? error.message : String(error);
-              logger.error(`Failed to open ShipAid learn more carousel: ${message}`);
-            }
-          });
-        } else {
-          this._pendingLearnMoreSource = null;
-        }
       },
       [this._popup]
     );
@@ -5851,74 +6115,8 @@ class ShipAidCheckoutPlus extends s$1 {
   }
   async _refreshShopifyCartUI() {
     try {
-      const sectionIds = ["cart-drawer", "cart-icon-bubble", "main-cart-items"];
-      const url = `/?sections=${encodeURIComponent(sectionIds.join(","))}`;
-      const res = await fetch(url, { credentials: "same-origin" });
-      if (!res.ok) return;
-      const htmlById = await res.json().catch(() => null);
-      if (!htmlById || typeof htmlById !== "object") return;
       this._isReplacingCartSections = true;
-      for (const id of Object.keys(htmlById)) {
-        const html2 = htmlById[id];
-        if (typeof html2 !== "string") continue;
-        const tmp = document.createElement("div");
-        tmp.innerHTML = html2;
-        if (id === "cart-drawer") {
-          try {
-            const newDrawer = tmp.querySelector("cart-drawer");
-            const oldDrawer = document.querySelector("cart-drawer");
-            if (newDrawer && oldDrawer) {
-              const shouldBeEmpty = newDrawer.classList.contains("is-empty");
-              if (shouldBeEmpty) oldDrawer.classList.add("is-empty");
-              else oldDrawer.classList.remove("is-empty");
-            }
-          } catch {
-          }
-          try {
-            const newDrawerItems = tmp.querySelector("cart-drawer-items");
-            const oldDrawerItems = document.querySelector("cart-drawer cart-drawer-items, .cart-drawer cart-drawer-items");
-            if (newDrawerItems && oldDrawerItems) {
-              oldDrawerItems.outerHTML = newDrawerItems.outerHTML;
-            }
-          } catch {
-          }
-          const newItems = tmp.querySelector("#CartDrawer-CartItems");
-          const oldItems = document.getElementById("CartDrawer-CartItems");
-          if (newItems && oldItems) {
-            oldItems.outerHTML = newItems.outerHTML;
-          }
-          const newFooter = tmp.querySelector(".cart-drawer__footer");
-          const oldFooter = document.querySelector(".cart-drawer .cart-drawer__footer");
-          if (newFooter && oldFooter) {
-            oldFooter.outerHTML = newFooter.outerHTML;
-          }
-          const newCtas = tmp.querySelector(".cart__ctas");
-          const oldCtas = document.querySelector(".cart-drawer .cart__ctas");
-          if (newCtas && oldCtas) {
-            oldCtas.outerHTML = newCtas.outerHTML;
-          }
-          continue;
-        }
-        if (id === "main-cart-items") {
-          const newMainItems = tmp.querySelector("#main-cart-items");
-          const oldMainItems = document.getElementById("main-cart-items");
-          if (newMainItems && oldMainItems) {
-            oldMainItems.outerHTML = newMainItems.outerHTML;
-          } else {
-            const section = document.getElementById("shopify-section-main-cart-items");
-            if (section) section.outerHTML = html2;
-          }
-          continue;
-        }
-        if (id === "cart-icon-bubble") {
-          const newBubble = tmp.querySelector("#cart-icon-bubble, [data-cart-count-bubble]");
-          const oldBubble = document.querySelector("#cart-icon-bubble, [data-cart-count-bubble]");
-          if (newBubble && oldBubble) {
-            oldBubble.replaceWith(newBubble);
-          }
-          continue;
-        }
-      }
+      await refreshShopifyCartUI();
     } catch {
     } finally {
       this._isReplacingCartSections = false;
@@ -5983,19 +6181,7 @@ class ShipAidCheckoutPlus extends s$1 {
     }
   }
   _ensureLearnMoreCarousel() {
-    var _a, _b, _c, _d;
-    try {
-      const existing = document.querySelector("shipaid-learn-more-carousel");
-      if (existing) return;
-      const el = document.createElement("shipaid-learn-more-carousel");
-      const isGreenEnabled = Boolean((_b = (_a = this._store) == null ? void 0 : _a.greenProtection) == null ? void 0 : _b.enabled);
-      const isFreeGiftEnabled = Boolean((_d = (_c = this._store) == null ? void 0 : _c.freeGifts) == null ? void 0 : _d.enabled);
-      if (isGreenEnabled) el.setAttribute("green-protection", "true");
-      if (isFreeGiftEnabled) el.setAttribute("free-gift", "true");
-      el.setAttribute("carousel-state", "close");
-      document.body.appendChild(el);
-    } catch {
-    }
+    ensureLearnMoreCarousel(this._store);
   }
   _shouldShowWidget() {
     var _a;
@@ -6004,7 +6190,6 @@ class ShipAidCheckoutPlus extends s$1 {
       console.warn("[ShipAid] Plan is not active, skipping widget mount");
       return false;
     }
-    if (!this._hasCheckoutButtons) return false;
     return ((_a = this._store.checkoutPlus) == null ? void 0 : _a.enabled) === true;
   }
   updated(changed) {
@@ -6201,6 +6386,7 @@ class ShipAidCheckoutPlus extends s$1 {
         this._hasCheckoutButtons = false;
         return;
       }
+      this._hasCheckoutButtons = true;
       if (this.isClone) {
         const target = matches[0];
         this._originalCheckoutButton = target;
@@ -6599,7 +6785,7 @@ class ShipAidCheckoutPlus extends s$1 {
   }
   render() {
     var _a, _b, _c, _d, _e;
-    if (!this._hasFinishedSetup || !this._shouldShowWidget()) return A;
+    if (!this._hasFinishedSetup || !this._shouldShowWidget() || !this._hasCheckoutButtons) return A;
     const isGreen = Boolean((_b = (_a = this._store) == null ? void 0 : _a.greenProtection) == null ? void 0 : _b.enabled);
     const isFreeGiftEnabled = Boolean((_d = (_c = this._store) == null ? void 0 : _c.freeGifts) == null ? void 0 : _d.enabled);
     const iconImg = isGreen || isFreeGiftEnabled ? ShipAidImpactIcon : ShipAidBlueIcon;