@gomusdev/web-components 2.1.1-next.1 → 3.0.0-next.1

package/dist-js/gomus-webcomponents.iife.js

@@ -11453,17 +11453,17 @@ var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot
       console.warn(`Failed to remove from localStorage (${key}):`, e);
     }
   }
-  const KEY$5 = "go-capacity";
+  const KEY$6 = "go-capacity";
   function saveCapacityToLocalStorage(allSeats, allQuotas) {
-    const existing = loadFromLocalStorage(KEY$5);
+    const existing = loadFromLocalStorage(KEY$6);
     const merged = {
       allSeats: { ...existing?.allSeats || {}, ...allSeats },
       allQuotas: { ...existing?.allQuotas || {}, ...allQuotas }
     };
-    saveToLocalStorage(KEY$5, merged);
+    saveToLocalStorage(KEY$6, merged);
   }
   function loadCapacityFromLocalStorage(manager) {
-    const data = loadFromLocalStorage(KEY$5);
+    const data = loadFromLocalStorage(KEY$6);
     if (!data) return;
     if (data.allSeats) {
       for (const dateId in data.allSeats) {
@@ -11478,13 +11478,13 @@ var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot
   function syncCapacityAcrossTabs(manager) {
     if (!isLocalStorageAvailable()) return;
     window.addEventListener("storage", (event2) => {
-      if (event2.key === KEY$5) {
+      if (event2.key === KEY$6) {
         loadCapacityFromLocalStorage(manager);
       }
       if (event2.key === "go-cart") {
         const cart = loadFromLocalStorage("go-cart");
         const cartEmpty = !cart || !cart.items || cart.items.length === 0;
-        if (cartEmpty) removeFromLocalStorage(KEY$5);
+        if (cartEmpty) removeFromLocalStorage(KEY$6);
       }
     });
   }
@@ -12610,21 +12610,13 @@ var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot
     checkout(params) {
       return this.apiPost(`/api/v4/orders`, { body: params, requiredFields: ["items", "total"] });
     }
-    // Single-slot memo: dedupes identical /api/v4/cart projections across multiple
-    // <go-cart> instances and back-to-back effect runs so the endpoint's rate
-    // limit is not hit by a page that mounts several cart views.
-    #cartProjectionCache = null;
-    createCart(params) {
+    #lastCart = null;
+    async createCart(params) {
       const key = JSON.stringify({ items: params.items ?? [], coupons: params.coupons ?? [] });
-      if (this.#cartProjectionCache?.key === key) {
-        return this.#cartProjectionCache.promise;
-      }
-      const promise = this.apiPost(`/api/v4/cart`, { body: params, requiredFields: ["items"] }).catch((err2) => {
-        if (this.#cartProjectionCache?.key === key) this.#cartProjectionCache = null;
-        throw err2;
-      });
-      this.#cartProjectionCache = { key, promise };
-      return promise;
+      if (this.#lastCart?.key === key) return this.#lastCart.result;
+      const result = await this.apiPost(`/api/v4/cart`, { body: params, requiredFields: ["items"] });
+      this.#lastCart = { key, result };
+      return result;
     }
     order(token) {
       return this.fetchAndCache("/api/v4/orders/{id}", `order-${token}`, "order", { path: { id: token } });
@@ -12967,11 +12959,11 @@ var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot
       }
     }
   }
-  const KEY$4 = "go-annual-ticket-personalization";
-  const setPersonalizationDetails = createSetDetails(KEY$4);
-  const getPersonalizationDetails = createGetDetails(KEY$4);
-  var root_3$9 = /* @__PURE__ */ from_html(`<li><a> </a></li>`);
-  var root_2$r = /* @__PURE__ */ from_html(`<ul class="go-annual-ticket"><li class="go-annual-ticket-title"> </li> <li class="go-annual-ticket-personalization-count"> </li> <!></ul>`);
+  const KEY$5 = "go-annual-ticket-personalization";
+  const setPersonalizationDetails = createSetDetails(KEY$5);
+  const getPersonalizationDetails = createGetDetails(KEY$5);
+  var root_3$a = /* @__PURE__ */ from_html(`<li><a> </a></li>`);
+  var root_2$s = /* @__PURE__ */ from_html(`<ul class="go-annual-ticket"><li class="go-annual-ticket-title"> </li> <li class="go-annual-ticket-personalization-count"> </li> <!></ul>`);
   function AnnualTicketPersonalization($$anchor, $$props) {
     push($$props, true);
     let token = prop($$props, "token", 7);
@@ -12998,7 +12990,7 @@ var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot
         var fragment_1 = comment();
         var node_1 = first_child(fragment_1);
         each(node_1, 17, () => get$2(order).ticket_sales, (ticketSale) => ticketSale.id, ($$anchor3, ticketSale) => {
-          var ul = root_2$r();
+          var ul = root_2$s();
           var li = child(ul);
           var text2 = child(li, true);
           reset(li);
@@ -13008,7 +13000,7 @@ var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot
           var node_2 = sibling(li_1, 2);
           {
             var consequent = ($$anchor4) => {
-              var li_2 = root_3$9();
+              var li_2 = root_3$a();
               var a2 = child(li_2);
               var text_2 = child(a2, true);
               reset(a2);
@@ -16670,9 +16662,9 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       });
     }
   }
-  const KEY$3 = "go-form-details";
-  const setDetails$1 = createSetDetails(KEY$3);
-  const getDetails$1 = createGetDetails(KEY$3);
+  const KEY$4 = "go-form-details";
+  const setDetails$1 = createSetDetails(KEY$4);
+  const getDetails$1 = createGetDetails(KEY$4);
   function wrapInElement(host, tag, props) {
     const first = host.firstElementChild || void 0;
     if (host.children?.length === 1 && first?.tagName.toLowerCase() === tag) {
@@ -16696,7 +16688,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     host.replaceChildren(element);
     return element;
   }
-  var root_1$l = /* @__PURE__ */ from_html(`<go-all-fields></go-all-fields> <go-form-feedback><go-errors-feedback></go-errors-feedback> <go-success-feedback></go-success-feedback></go-form-feedback> <go-submit> </go-submit>`, 3);
+  var root_1$q = /* @__PURE__ */ from_html(`<go-all-fields></go-all-fields> <go-form-feedback><go-errors-feedback></go-errors-feedback> <go-success-feedback></go-success-feedback></go-form-feedback> <go-submit> </go-submit>`, 3);
   function Form($$anchor, $$props) {
     push($$props, true);
     let formId = prop($$props, "formId", 7), custom2 = prop($$props, "custom", 7);
@@ -16739,7 +16731,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     var node = first_child(fragment);
     {
       var consequent = ($$anchor2) => {
-        var fragment_1 = root_1$l();
+        var fragment_1 = root_1$q();
         var go_all_fields = first_child(fragment_1);
         var go_form_feedback = sibling(go_all_fields, 2);
         var go_submit = sibling(go_form_feedback, 2);
@@ -16900,7 +16892,128 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     [],
     []
   ));
-  var root_1$k = /* @__PURE__ */ from_html(`<span class="go-cart-item-date" data-testid="cart-item-date"> </span><span class="go-cart-item-time" data-testid="cart-item-time"> </span>`, 1);
+  function getQuantity(value, fallback) {
+    if (typeof value === "number" && Number.isFinite(value)) return value;
+    if (value && typeof value === "object") {
+      const total = Object.values(value).reduce((sum2, num) => {
+        return typeof num === "number" && Number.isFinite(num) ? sum2 + num : sum2;
+      }, 0);
+      if (total > 0) return total;
+    }
+    return fallback;
+  }
+  function resolveQuantitySource(attrs) {
+    return "quantity" in attrs && attrs.quantity !== void 0 ? attrs.quantity : attrs.quantities;
+  }
+  function resolveApiQuantity(attrs) {
+    return getQuantity(resolveQuantitySource(attrs), 0);
+  }
+  function getScalePriceId(attrs) {
+    const source2 = resolveQuantitySource(attrs);
+    if (source2 && typeof source2 === "object") {
+      const keys = Object.keys(source2);
+      if (keys.length > 0) return Number(keys[0]);
+    }
+    return void 0;
+  }
+  function createDisplayCart(baseCart, apiItems) {
+    const displayCart = createCart();
+    const appliedCoupons = /* @__PURE__ */ new Set();
+    baseCart.coupons.forEach((coupon) => displayCart.addCoupon(coupon));
+    apiItems.forEach((apiItem) => {
+      const attrs = apiItem.attributes;
+      const scalePriceId = getScalePriceId(attrs);
+      const itemInBaseCart = baseCart.items.find(
+        (i) => i.type.toLowerCase() === apiItem.type.toLowerCase() && i.product.id === attrs.id && (!attrs.time || i.time === attrs.time) && (scalePriceId === void 0 || isEventTicket(i.product) && i.product.scale_price_id === scalePriceId)
+      );
+      if (!itemInBaseCart) {
+        console.error("(go-cart) Ignoring unmatched cart line", { type: apiItem.type, attrs });
+        return;
+      }
+      if (attrs.coupon) {
+        displayCart.addCoupon(attrs.coupon);
+        appliedCoupons.add(attrs.coupon);
+      }
+      displayCart.addItem(createDisplayCartItem(itemInBaseCart, attrs));
+    });
+    return { cart: displayCart, appliedCoupons };
+  }
+  function createDisplayCartItem(cartItem, attrs) {
+    const quantity = resolveApiQuantity(attrs);
+    const displayPrice = attrs.price_cents ?? cartItem.product.price_cents;
+    const originalPrice = cartItem.product.price_cents;
+    const discounted = displayPrice < originalPrice;
+    const product = { ...cartItem.product, price_cents: displayPrice };
+    return createCartItem(product, {
+      quantity,
+      time: cartItem.time,
+      display: {
+        discounted,
+        reference_uuid: cartItem.uuid,
+        originalPrice
+      }
+    });
+  }
+  class CartDetails {
+    #displayCart = /* @__PURE__ */ state();
+    get displayCart() {
+      return get$2(this.#displayCart);
+    }
+    set displayCart(value) {
+      set(this.#displayCart, value, true);
+    }
+    #appliedCoupons = /* @__PURE__ */ state(proxy(/* @__PURE__ */ new Set()));
+    get appliedCoupons() {
+      return get$2(this.#appliedCoupons);
+    }
+    set appliedCoupons(value) {
+      set(this.#appliedCoupons, value, true);
+    }
+    #preview = /* @__PURE__ */ state(false);
+    get preview() {
+      return get$2(this.#preview);
+    }
+    set preview(value) {
+      set(this.#preview, value, true);
+    }
+    get totalPriceCents() {
+      return this.displayCart?.totalPriceCents ?? 0;
+    }
+    get subtotalPriceCents() {
+      return shop.cart?.totalPriceCents ?? 0;
+    }
+    get discountedAmountCents() {
+      return Math.max(0, this.subtotalPriceCents - this.totalPriceCents);
+    }
+    get isDiscounted() {
+      return this.discountedAmountCents > 0;
+    }
+    async calculateDisplayCart() {
+      const mc = shop.cart;
+      if (!mc) return;
+      try {
+        const { items, coupons } = mc.orderData();
+        const response = await shop.createCart({ items, coupons });
+        if (!response || "error" in response) {
+          if (response && "error" in response) {
+            console.error("(go-cart) Unable to fetch discounted cart data", response.error);
+          }
+          this.displayCart = mc;
+          return;
+        }
+        const result = createDisplayCart(mc, response.data.items ?? []);
+        this.displayCart = result.cart;
+        this.appliedCoupons = result.appliedCoupons;
+      } catch (error) {
+        console.error("(go-cart) Unable to fetch discounted cart data", error);
+        this.displayCart = mc;
+      }
+    }
+  }
+  const KEY$3 = "go-cart-details";
+  const setCartDetails = createSetDetails(KEY$3);
+  const getCartDetails = createGetDetails(KEY$3);
+  var root_1$p = /* @__PURE__ */ from_html(`<span class="go-cart-item-date" data-testid="cart-item-date"> </span><span class="go-cart-item-time" data-testid="cart-item-time"> </span>`, 1);
   var root$c = /* @__PURE__ */ from_html(`<span class="go-cart-item-title" data-testid="cart-item-title"><span class="go-cart-item-title-event-title"> </span><span class="go-cart-item-title-ticket-title"> </span></span><!>`, 1);
   function Event$2($$anchor, $$props) {
     push($$props, true);
@@ -16928,7 +17041,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     var node = sibling(span);
     {
       var consequent = ($$anchor2) => {
-        var fragment_1 = root_1$k();
+        var fragment_1 = root_1$p();
         var span_3 = first_child(fragment_1);
         var text_2 = child(span_3, true);
         reset(span_3);
@@ -16959,8 +17072,8 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     return pop($$exports);
   }
   create_custom_element(Event$2, { cartItem: {} }, [], [], { mode: "open" });
-  var root_2$q = /* @__PURE__ */ from_html(`<span class="go-cart-item-time" data-testid="cart-item-time"> </span>`);
-  var root_1$j = /* @__PURE__ */ from_html(`<span class="go-cart-item-date" data-testid="cart-item-date"> </span> <!>`, 1);
+  var root_2$r = /* @__PURE__ */ from_html(`<span class="go-cart-item-time" data-testid="cart-item-time"> </span>`);
+  var root_1$o = /* @__PURE__ */ from_html(`<span class="go-cart-item-date" data-testid="cart-item-date"> </span> <!>`, 1);
   var root$b = /* @__PURE__ */ from_html(`<span class="go-cart-item-title" data-testid="cart-item-title"> </span> <!>`, 1);
   function Ticket($$anchor, $$props) {
     push($$props, true);
@@ -16981,14 +17094,14 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     var node = sibling(span, 2);
     {
       var consequent_1 = ($$anchor2) => {
-        var fragment_1 = root_1$j();
+        var fragment_1 = root_1$o();
         var span_1 = first_child(fragment_1);
         var text_1 = child(span_1, true);
         reset(span_1);
         var node_1 = sibling(span_1, 2);
         {
           var consequent = ($$anchor3) => {
-            var span_2 = root_2$q();
+            var span_2 = root_2$r();
             var text_2 = child(span_2, true);
             reset(span_2);
             template_effect(($0) => set_text(text_2, $0), [() => formatTime(cartItem().time)]);
@@ -17031,21 +17144,21 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
   function option(value) {
     return { value, label: value.toString() };
   }
-  var root_5$2 = /* @__PURE__ */ from_html(`<s class="go-cart-item-price-original"> </s> <span class="go-cart-item-price-discounted"> </span>`, 1);
-  var root_6$3 = /* @__PURE__ */ from_html(`<span class="go-cart-item-price-discounted"> </span>`);
-  var root_7$4 = /* @__PURE__ */ from_html(`<span> </span>`);
+  var root_5$1 = /* @__PURE__ */ from_html(`<s class="go-cart-item-price-original"> </s> <span class="go-cart-item-price-discounted"> </span>`, 1);
+  var root_6$2 = /* @__PURE__ */ from_html(`<span class="go-cart-item-price-discounted"> </span>`);
+  var root_7$3 = /* @__PURE__ */ from_html(`<span> </span>`);
   var root_9$4 = /* @__PURE__ */ from_html(`<option> </option>`);
   var root_8$3 = /* @__PURE__ */ from_html(`<select class="go-cart-item-select"></select>`);
-  var root_10$1 = /* @__PURE__ */ from_html(`<li class="go-cart-item-remove"><button>⨉</button></li>`);
-  var root_1$i = /* @__PURE__ */ from_html(`<article class="go-cart-item-content"><ul><li class="go-cart-item-title-container"><!></li> <li class="go-cart-item-price"><!></li> <li class="go-cart-item-count"><!></li> <!> <li class="go-cart-item-sum"> </li></ul></article>`);
+  var root_10$1 = /* @__PURE__ */ from_html(`<li class="go-cart-item-remove"><button class="go-cart-remove">⨉</button></li>`);
+  var root_1$n = /* @__PURE__ */ from_html(`<article class="go-cart-item-content"><ul><li class="go-cart-item-title-container"><!></li> <li class="go-cart-item-price"><!></li> <li class="go-cart-item-count"><!></li> <!> <li class="go-cart-item-sum"> </li></ul></article>`);
   function Item$1($$anchor, $$props) {
     push($$props, true);
-    let displayItem = prop($$props, "displayItem", 7), displayCart = prop($$props, "displayCart", 7), mainCart = prop($$props, "mainCart", 7), preview = prop($$props, "preview", 7);
+    let displayItem = prop($$props, "displayItem", 7), displayCart = prop($$props, "displayCart", 7), preview = prop($$props, "preview", 7);
     let capacity = /* @__PURE__ */ state(void 0);
-    const itemInMaincart = /* @__PURE__ */ user_derived(() => mainCart().items.find((item) => item.uuid === (displayItem().display?.reference_uuid ?? displayItem().uuid)));
+    const itemInMaincart = /* @__PURE__ */ user_derived(() => shop.cart?.items.find((item) => item.uuid === (displayItem().display?.reference_uuid ?? displayItem().uuid)));
     const emptyCart = createCart();
     user_effect(() => {
-      mainCart().items.map((i) => i.quantity);
+      shop.cart?.items.map((i) => i.quantity);
       untrack(() => {
         set(capacity, shop.capacityManager.capacity(displayCart(), displayItem(), emptyCart), true);
       });
@@ -17066,7 +17179,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       }
       const newQuantity = Math.max(0, get$2(itemInMaincart).quantity - displayItem().quantity);
       if (newQuantity === 0) {
-        mainCart().deleteItem(get$2(itemInMaincart));
+        shop.cart?.deleteItem(get$2(itemInMaincart));
       } else {
         get$2(itemInMaincart).quantity = newQuantity;
       }
@@ -17086,13 +17199,6 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         displayCart($$value);
         flushSync();
       },
-      get mainCart() {
-        return mainCart();
-      },
-      set mainCart($$value) {
-        mainCart($$value);
-        flushSync();
-      },
       get preview() {
         return preview();
       },
@@ -17105,7 +17211,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     var node = first_child(fragment);
     {
       var consequent_5 = ($$anchor2) => {
-        var article = root_1$i();
+        var article = root_1$n();
         var ul = child(article);
         var li = child(ul);
         var node_1 = child(li);
@@ -17148,7 +17254,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         var node_3 = child(li_1);
         {
           var consequent_2 = ($$anchor3) => {
-            var fragment_4 = root_5$2();
+            var fragment_4 = root_5$1();
             var s = first_child(fragment_4);
             var text2 = child(s, true);
             reset(s);
@@ -17168,7 +17274,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
             append($$anchor3, fragment_4);
           };
           var alternate_1 = ($$anchor3) => {
-            var span_1 = root_6$3();
+            var span_1 = root_6$2();
             var text_2 = child(span_1, true);
             reset(span_1);
             template_effect(($0) => set_text(text_2, $0), [() => formatCurrency(displayItem().final_price_cents)]);
@@ -17184,7 +17290,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         var node_4 = child(li_2);
         {
           var consequent_3 = ($$anchor3) => {
-            var span_2 = root_7$4();
+            var span_2 = root_7$3();
             var text_3 = child(span_2, true);
             reset(span_2);
             template_effect(() => set_text(text_3, displayItem().quantity));
@@ -17224,6 +17330,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
             var button = child(li_3);
             button.__click = del;
             reset(li_3);
+            template_effect(($0) => set_attribute(button, "aria-label", $0), [() => shop.t("cart.item.remove")]);
             append($$anchor3, li_3);
           };
           if_block(node_5, ($$render) => {
@@ -17246,131 +17353,19 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     return pop($$exports);
   }
   delegate(["change", "click"]);
-  create_custom_element(Item$1, { displayItem: {}, displayCart: {}, mainCart: {}, preview: {} }, [], [], { mode: "open" });
-  function getQuantity(value, fallback) {
-    if (typeof value === "number" && Number.isFinite(value)) return value;
-    if (value && typeof value === "object") {
-      const total = Object.values(value).reduce((sum2, num) => {
-        return typeof num === "number" && Number.isFinite(num) ? sum2 + num : sum2;
-      }, 0);
-      if (total > 0) return total;
-    }
-    return fallback;
-  }
-  function resolveQuantitySource(attrs) {
-    return "quantity" in attrs && attrs.quantity !== void 0 ? attrs.quantity : attrs.quantities;
-  }
-  function resolveApiQuantity(attrs) {
-    return getQuantity(resolveQuantitySource(attrs), 0);
-  }
-  function getScalePriceId(attrs) {
-    const source2 = resolveQuantitySource(attrs);
-    if (source2 && typeof source2 === "object") {
-      const keys = Object.keys(source2);
-      if (keys.length > 0) return Number(keys[0]);
-    }
-    return void 0;
-  }
-  function createDisplayCart(baseCart, apiItems) {
-    const displayCart = createCart();
-    const appliedCoupons = /* @__PURE__ */ new Set();
-    baseCart.coupons.forEach((coupon) => displayCart.addCoupon(coupon));
-    apiItems.forEach((apiItem) => {
-      const attrs = apiItem.attributes;
-      const scalePriceId = getScalePriceId(attrs);
-      const itemInBaseCart = baseCart.items.find(
-        (i) => i.type.toLowerCase() === apiItem.type.toLowerCase() && i.product.id === attrs.id && (!attrs.time || i.time === attrs.time) && (scalePriceId === void 0 || isEventTicket(i.product) && i.product.scale_price_id === scalePriceId)
-      );
-      if (!itemInBaseCart) {
-        console.error("(go-cart) Ignoring unmatched cart line", { type: apiItem.type, attrs });
-        return;
-      }
-      if (attrs.coupon) {
-        displayCart.addCoupon(attrs.coupon);
-        appliedCoupons.add(attrs.coupon);
-      }
-      displayCart.addItem(createDisplayCartItem(itemInBaseCart, attrs));
-    });
-    return { cart: displayCart, appliedCoupons };
-  }
-  function createDisplayCartItem(cartItem, attrs) {
-    const quantity = resolveApiQuantity(attrs);
-    const displayPrice = attrs.price_cents ?? cartItem.product.price_cents;
-    const originalPrice = cartItem.product.price_cents;
-    const discounted = displayPrice < originalPrice;
-    const product = { ...cartItem.product, price_cents: displayPrice };
-    return createCartItem(product, {
-      quantity,
-      time: cartItem.time,
-      display: {
-        discounted,
-        reference_uuid: cartItem.uuid,
-        originalPrice
-      }
-    });
-  }
-  var root_2$p = /* @__PURE__ */ from_html(`<li class="go-cart-header-remove"></li>`);
-  var root_3$8 = /* @__PURE__ */ from_html(`<li class="go-cart-item"><!></li>`);
-  var root_6$2 = /* @__PURE__ */ from_html(`<li class="go-cart-item-remove"><button>⨉</button></li>`);
-  var root_5$1 = /* @__PURE__ */ from_html(`<li><article class="go-cart-item-content"><ul><li class="go-cart-item-title"> </li> <li class="go-cart-item-price"></li> <li class="go-cart-item-count"></li> <!> <li class="go-cart-item-sum"></li></ul></article></li>`);
-  var root_7$3 = /* @__PURE__ */ from_html(`<li class="go-cart-footer-remove"></li>`);
-  var root_1$h = /* @__PURE__ */ from_html(`<ol data-testid="cart"><li class="go-cart-header"><ul><li class="go-cart-header-title"> </li> <li class="go-cart-header-price"> </li> <li class="go-cart-header-count"> </li> <!> <li class="go-cart-header-sum"> </li></ul></li> <!> <!> <li class="go-cart-footer"><ul><li class="go-cart-footer-title"></li> <li class="go-cart-footer-price"></li> <li class="go-cart-footer-count"></li> <!> <li class="go-cart-footer-sum"> </li></ul></li></ol>`);
-  function Cart($$anchor, $$props) {
+  create_custom_element(Item$1, { displayItem: {}, displayCart: {}, preview: {} }, [], [], { mode: "open" });
+  var root_2$q = /* @__PURE__ */ from_html(`<li class="go-cart-header-remove"></li>`);
+  var root_3$9 = /* @__PURE__ */ from_html(`<li class="go-cart-item"><!></li>`);
+  var root_1$m = /* @__PURE__ */ from_html(`<ol data-testid="cart-items"><li class="go-cart-header"><ul><li class="go-cart-header-title"> </li> <li class="go-cart-header-price"> </li> <li class="go-cart-header-count"> </li> <!> <li class="go-cart-header-sum"> </li></ul></li> <!></ol>`);
+  function CartItems($$anchor, $$props) {
     push($$props, true);
-    const preview = prop($$props, "preview", 7, false);
-    let cart = /* @__PURE__ */ user_derived(() => shop.cart);
-    let displayCart = /* @__PURE__ */ state(proxy(get$2(cart)));
-    let appliedCoupons = /* @__PURE__ */ state(proxy(/* @__PURE__ */ new Set()));
-    let requestId = 0;
-    const displayTotalCents = /* @__PURE__ */ user_derived(() => get$2(displayCart)?.totalPriceCents ?? 0);
-    user_effect(() => {
-      if (!get$2(cart)) {
-        return;
-      }
-      get$2(cart).items.map((i) => i.uuid + ":" + i.quantity + ":" + i.time);
-      get$2(cart).coupons.join("|");
-      const currentRequest = ++requestId;
-      if (get$2(cart).items.length === 0 || get$2(cart).coupons.length === 0) {
-        set(displayCart, get$2(cart), true);
-        set(appliedCoupons, /* @__PURE__ */ new Set(), true);
-        return;
-      }
-      void (async () => {
-        try {
-          const { items, coupons } = get$2(cart).orderData();
-          const response = await shop.createCart({ items, coupons });
-          if (currentRequest !== requestId || !get$2(cart)) return;
-          if (!response || "error" in response) {
-            if (response && "error" in response) {
-              console.error("(go-cart) Unable to fetch discounted cart data", response.error);
-            }
-            set(displayCart, get$2(cart), true);
-            return;
-          }
-          const result = createDisplayCart(get$2(cart), response.data.items ?? []);
-          set(displayCart, result.cart, true);
-          set(appliedCoupons, result.appliedCoupons, true);
-        } catch (error) {
-          console.error("(go-cart) Unable to fetch discounted cart data", error);
-          if (currentRequest !== requestId || !get$2(cart)) return;
-          set(displayCart, get$2(cart), true);
-        }
-      })();
-    });
-    var $$exports = {
-      get preview() {
-        return preview();
-      },
-      set preview($$value = false) {
-        preview($$value);
-        flushSync();
-      }
-    };
+    const _details = getCartDetails($$props.$$host);
+    const details = /* @__PURE__ */ user_derived(() => _details.value);
     var fragment = comment();
     var node = first_child(fragment);
     {
-      var consequent_4 = ($$anchor2) => {
-        var ol = root_1$h();
+      var consequent_1 = ($$anchor2) => {
+        var ol = root_1$m();
         var li = child(ol);
         var ul = child(li);
         var li_1 = child(ul);
@@ -17385,11 +17380,11 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         var node_1 = sibling(li_3, 2);
         {
           var consequent = ($$anchor3) => {
-            var li_4 = root_2$p();
+            var li_4 = root_2$q();
             append($$anchor3, li_4);
           };
           if_block(node_1, ($$render) => {
-            if (!preview()) $$render(consequent);
+            if (!get$2(details).preview) $$render(consequent);
           });
         }
         var li_5 = sibling(node_1, 2);
@@ -17398,120 +17393,236 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         reset(ul);
         reset(li);
         var node_2 = sibling(li, 2);
-        each(node_2, 17, () => get$2(displayCart).items, (item) => item.uuid, ($$anchor3, item) => {
-          var li_6 = root_3$8();
+        each(node_2, 17, () => get$2(details).displayCart.items, (item) => item.uuid, ($$anchor3, item) => {
+          var li_6 = root_3$9();
           var node_3 = child(li_6);
           Item$1(node_3, {
             get displayItem() {
               return get$2(item);
             },
             get displayCart() {
-              return get$2(displayCart);
-            },
-            get mainCart() {
-              return get$2(cart);
+              return get$2(details).displayCart;
             },
             get preview() {
-              return preview();
+              return get$2(details).preview;
             }
           });
           reset(li_6);
           append($$anchor3, li_6);
         });
-        var node_4 = sibling(node_2, 2);
-        {
-          var consequent_2 = ($$anchor3) => {
-            var fragment_1 = comment();
-            var node_5 = first_child(fragment_1);
-            each(node_5, 16, () => get$2(displayCart).coupons, (coupon) => coupon, ($$anchor4, coupon) => {
-              var li_7 = root_5$1();
-              let classes;
-              var article = child(li_7);
-              var ul_1 = child(article);
-              var li_8 = child(ul_1);
-              var text_4 = child(li_8, true);
-              reset(li_8);
-              var node_6 = sibling(li_8, 6);
-              {
-                var consequent_1 = ($$anchor5) => {
-                  var li_9 = root_6$2();
-                  var button = child(li_9);
-                  button.__click = () => get$2(cart)?.removeCoupon(coupon);
-                  reset(li_9);
-                  append($$anchor5, li_9);
-                };
-                if_block(node_6, ($$render) => {
-                  if (!preview()) $$render(consequent_1);
-                });
-              }
-              next(2);
-              reset(ul_1);
-              reset(article);
-              reset(li_7);
-              template_effect(
-                ($0) => {
-                  classes = set_class(li_7, 1, "go-cart-item", null, classes, $0);
-                  set_text(text_4, coupon);
-                },
-                [
-                  () => ({
-                    "go-cart-coupon-inactive": !get$2(appliedCoupons).has(coupon)
-                  })
-                ]
-              );
-              append($$anchor4, li_7);
-            });
-            append($$anchor3, fragment_1);
-          };
-          if_block(node_4, ($$render) => {
-            if (get$2(displayCart).coupons.length > 0) $$render(consequent_2);
-          });
-        }
-        var li_10 = sibling(node_4, 2);
-        var ul_2 = child(li_10);
-        var node_7 = sibling(child(ul_2), 6);
-        {
-          var consequent_3 = ($$anchor3) => {
-            var li_11 = root_7$3();
-            append($$anchor3, li_11);
-          };
-          if_block(node_7, ($$render) => {
-            if (!preview()) $$render(consequent_3);
-          });
-        }
-        var li_12 = sibling(node_7, 2);
-        var text_5 = child(li_12, true);
-        reset(li_12);
-        reset(ul_2);
-        reset(li_10);
         reset(ol);
         template_effect(
-          ($0, $1, $2, $3, $4) => {
+          ($0, $1, $2, $3) => {
             set_text(text2, $0);
             set_text(text_1, $1);
             set_text(text_2, $2);
             set_text(text_3, $3);
-            set_text(text_5, $4);
           },
           [
             () => shop.t("cart.content.table.desc"),
             () => shop.t("cart.content.table.price"),
             () => shop.t("cart.content.table.quantity"),
-            () => shop.t("cart.content.table.total"),
-            () => formatCurrency(get$2(displayTotalCents))
+            () => shop.t("cart.content.table.total")
           ]
         );
         append($$anchor2, ol);
       };
       if_block(node, ($$render) => {
-        if (get$2(displayCart) && get$2(displayCart).items.length) $$render(consequent_4);
+        if (get$2(details) && get$2(details).displayCart && get$2(details).displayCart.items.length) $$render(consequent_1);
       });
     }
     append($$anchor, fragment);
-    return pop($$exports);
+    pop();
+  }
+  customElements.define("go-cart-items", create_custom_element(CartItems, {}, [], []));
+  var root_3$8 = /* @__PURE__ */ from_html(`<li class="go-cart-coupon-remove-cell"><button class="go-cart-remove go-cart-coupon-remove">⨉</button></li>`);
+  var root_2$p = /* @__PURE__ */ from_html(`<li><article class="go-cart-coupon-content"><ul><li class="go-cart-coupon-code"> </li> <!></ul></article></li>`);
+  var root_1$l = /* @__PURE__ */ from_html(`<ol data-testid="cart-coupons"></ol>`);
+  function CartCoupons($$anchor, $$props) {
+    push($$props, true);
+    const _details = getCartDetails($$props.$$host);
+    const details = /* @__PURE__ */ user_derived(() => _details.value);
+    var fragment = comment();
+    var node = first_child(fragment);
+    {
+      var consequent_1 = ($$anchor2) => {
+        var ol = root_1$l();
+        each(ol, 20, () => get$2(details).displayCart.coupons, (coupon) => coupon, ($$anchor3, coupon) => {
+          var li = root_2$p();
+          let classes;
+          var article = child(li);
+          var ul = child(article);
+          var li_1 = child(ul);
+          var text2 = child(li_1, true);
+          reset(li_1);
+          var node_1 = sibling(li_1, 2);
+          {
+            var consequent = ($$anchor4) => {
+              var li_2 = root_3$8();
+              var button = child(li_2);
+              button.__click = () => shop.cart?.removeCoupon(coupon);
+              reset(li_2);
+              template_effect(($0) => set_attribute(button, "aria-label", $0), [() => shop.t("cart.coupons.remove")]);
+              append($$anchor4, li_2);
+            };
+            if_block(node_1, ($$render) => {
+              if (!get$2(details).preview) $$render(consequent);
+            });
+          }
+          reset(ul);
+          reset(article);
+          reset(li);
+          template_effect(
+            ($0) => {
+              classes = set_class(li, 1, "go-cart-coupon", null, classes, $0);
+              set_text(text2, coupon);
+            },
+            [
+              () => ({
+                "go-cart-coupon-inactive": !get$2(details).appliedCoupons.has(coupon)
+              })
+            ]
+          );
+          append($$anchor3, li);
+        });
+        reset(ol);
+        append($$anchor2, ol);
+      };
+      if_block(node, ($$render) => {
+        if (get$2(details) && get$2(details).displayCart && get$2(details).displayCart.coupons.length > 0) $$render(consequent_1);
+      });
+    }
+    append($$anchor, fragment);
+    pop();
   }
   delegate(["click"]);
-  customElements.define("go-cart", create_custom_element(Cart, { preview: {} }, [], []));
+  customElements.define("go-cart-coupons", create_custom_element(CartCoupons, {}, [], []));
+  var root_1$k = /* @__PURE__ */ from_html(`<span class="go-cart-total-amount" data-testid="cart-total-amount"> </span>`);
+  function CartTotalAmount($$anchor, $$props) {
+    push($$props, true);
+    const _details = getCartDetails($$props.$$host);
+    const details = /* @__PURE__ */ user_derived(() => _details.value);
+    var fragment = comment();
+    var node = first_child(fragment);
+    {
+      var consequent = ($$anchor2) => {
+        var span = root_1$k();
+        var text2 = child(span, true);
+        reset(span);
+        template_effect(($0) => set_text(text2, $0), [() => formatCurrency(get$2(details).totalPriceCents)]);
+        append($$anchor2, span);
+      };
+      if_block(node, ($$render) => {
+        if (get$2(details) && get$2(details).displayCart && get$2(details).displayCart.items.length) $$render(consequent);
+      });
+    }
+    append($$anchor, fragment);
+    pop();
+  }
+  customElements.define("go-cart-total-amount", create_custom_element(CartTotalAmount, {}, [], []));
+  var root_1$j = /* @__PURE__ */ from_html(`<go-cart-items></go-cart-items> <go-cart-coupons></go-cart-coupons> <go-cart-total-amount></go-cart-total-amount>`, 3);
+  function Cart($$anchor, $$props) {
+    push($$props, true);
+    const preview = prop($$props, "preview", 7, false), useDefault = prop($$props, "default", 7, false);
+    const details = new CartDetails();
+    setCartDetails($$props.$$host, details);
+    user_effect(() => {
+      details.preview = preview();
+    });
+    user_effect(() => {
+      if (!shop.cart) return;
+      shop.cart.items.map((i) => i.uuid + ":" + i.quantity + ":" + i.time);
+      shop.cart.coupons.join("|");
+      untrack(() => details.calculateDisplayCart());
+    });
+    var $$exports = {
+      get preview() {
+        return preview();
+      },
+      set preview($$value = false) {
+        preview($$value);
+        flushSync();
+      },
+      get default() {
+        return useDefault();
+      },
+      set default($$value = false) {
+        useDefault($$value);
+        flushSync();
+      }
+    };
+    var fragment = comment();
+    var node = first_child(fragment);
+    {
+      var consequent = ($$anchor2) => {
+        var fragment_1 = root_1$j();
+        var go_cart_items = first_child(fragment_1);
+        var go_cart_coupons = sibling(go_cart_items, 2);
+        sibling(go_cart_coupons, 2);
+        append($$anchor2, fragment_1);
+      };
+      if_block(node, ($$render) => {
+        if (useDefault()) $$render(consequent);
+      });
+    }
+    append($$anchor, fragment);
+    return pop($$exports);
+  }
+  customElements.define("go-cart", create_custom_element(
+    Cart,
+    {
+      preview: { attribute: "preview", reflect: true, type: "Boolean" },
+      default: { attribute: "default", reflect: true, type: "Boolean" }
+    },
+    [],
+    []
+  ));
+  var root_1$i = /* @__PURE__ */ from_html(`<span class="go-cart-subtotal-amount" data-testid="cart-subtotal-amount"> </span>`);
+  function CartSubtotalAmount($$anchor, $$props) {
+    push($$props, true);
+    const _details = getCartDetails($$props.$$host);
+    const details = /* @__PURE__ */ user_derived(() => _details.value);
+    var fragment = comment();
+    var node = first_child(fragment);
+    {
+      var consequent = ($$anchor2) => {
+        var span = root_1$i();
+        var text2 = child(span, true);
+        reset(span);
+        template_effect(($0) => set_text(text2, $0), [() => formatCurrency(get$2(details).subtotalPriceCents)]);
+        append($$anchor2, span);
+      };
+      if_block(node, ($$render) => {
+        if (get$2(details) && shop.cart?.items.length) $$render(consequent);
+      });
+    }
+    append($$anchor, fragment);
+    pop();
+  }
+  customElements.define("go-cart-subtotal-amount", create_custom_element(CartSubtotalAmount, {}, [], []));
+  var root_1$h = /* @__PURE__ */ from_html(`<span class="go-cart-discounted-amount" data-testid="cart-discounted-amount"><span class="go-cart-discounted-amount-sign">−</span> </span>`);
+  function CartDiscountedAmount($$anchor, $$props) {
+    push($$props, true);
+    const _details = getCartDetails($$props.$$host);
+    const details = /* @__PURE__ */ user_derived(() => _details.value);
+    var fragment = comment();
+    var node = first_child(fragment);
+    {
+      var consequent = ($$anchor2) => {
+        var span = root_1$h();
+        var text2 = sibling(child(span), 1, true);
+        reset(span);
+        template_effect(($0) => set_text(text2, $0), [() => formatCurrency(get$2(details).discountedAmountCents)]);
+        append($$anchor2, span);
+      };
+      if_block(node, ($$render) => {
+        if (get$2(details) && get$2(details).discountedAmountCents > 0) $$render(consequent);
+      });
+    }
+    append($$anchor, fragment);
+    pop();
+  }
+  customElements.define("go-cart-discounted-amount", create_custom_element(CartDiscountedAmount, {}, [], []));
   function CartEmpty($$anchor, $$props) {
     push($$props, true);
     wrapInElement($$props.$$host, "go-if", { when: "data.cart.items.length === 0" });
@@ -17545,9 +17656,20 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       ]
     });
     wrapInElement($$props.$$host, "go-form", { "form-id": "checkoutGuest", custom: custom2() });
+    async function flushCoupons() {
+      const couponEls = document.querySelectorAll("go-coupon-redemption");
+      let allOk = true;
+      for (const el of couponEls) {
+        const result = await el.flush?.();
+        if (result && !result.success) allOk = false;
+      }
+      return allOk;
+    }
+    $$props.$$host.addEventListener("go-after-validation", flushCoupons);
     $$props.$$host.addEventListener("submit", async (e) => {
       const form = e.target;
       if (!get$2(cart)) return;
+      if (!await flushCoupons()) return;
       const auth = await shop.signUp(form.details.formData, true);
       if (auth.error) {
         form.details.apiErrors = auth.error.errors;
@@ -17579,7 +17701,6 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     return pop($$exports);
   }
   customElements.define("go-checkout-form", create_custom_element(CheckoutForm, { custom: {} }, [], []));
-  enable_legacy_mode_flag();
   const APPLY_ORDER_DISCOUNT = "TokenActions::ApplyOrderDiscount";
   async function redeem(token) {
     if (!shop.cart) {
@@ -17619,32 +17740,42 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
   }
   var root$a = /* @__PURE__ */ from_html(`<go-form></go-form>`, 2);
   function CouponRedemption($$anchor, $$props) {
-    push($$props, false);
+    push($$props, true);
     Forms.defineForm({
       id: "couponRedemption",
       submitLabel: "cart.coupon.form.submit",
       fields: [{ key: "token", required: true }]
     });
-    async function redeem$1(event2) {
-      const form = event2.target;
+    async function runRedeem(form) {
       const field = form.details.fields.find((f) => f.key === "token");
-      const token = form.details.fieldValue("token").trim();
+      const token = (form.details.fieldValue("token") ?? "").trim();
+      if (!token) return { success: true };
       const result = await redeem(token);
       if (!result.success) {
         form.details.apiErrors = result.errors;
-        return;
+        return result;
       }
-      field.value = "";
+      if (field) field.value = "";
       form.dispatchEvent(new Event("go-success", { bubbles: true, composed: true }));
+      return result;
     }
-    init();
+    async function redeem$1(event2) {
+      await runRedeem(event2.target);
+    }
+    async function flush() {
+      const form = $$props.$$host.querySelector("go-form");
+      if (!form?.details) return { success: true };
+      return runRedeem(form);
+    }
+    var $$exports = { flush };
     var go_form = root$a();
     set_custom_element_data(go_form, "formId", "couponRedemption");
     event("submit", go_form, redeem$1);
     append($$anchor, go_form);
-    pop();
+    return pop($$exports);
   }
-  customElements.define("go-coupon-redemption", create_custom_element(CouponRedemption, {}, [], []));
+  customElements.define("go-coupon-redemption", create_custom_element(CouponRedemption, {}, [], ["flush"]));
+  enable_legacy_mode_flag();
   class GoDonation {
     #campaign = /* @__PURE__ */ state();
     get campaign() {
@@ -34582,11 +34713,14 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     const personalizationDetails = /* @__PURE__ */ user_derived(() => _personalizationDetails.value);
     const _formDetails = getDetails$1($$props.$$host);
     const formDetails = /* @__PURE__ */ user_derived(() => _formDetails.value);
+    const _cartView = getCartDetails($$props.$$host);
+    const cartView = /* @__PURE__ */ user_derived(() => _cartView.value);
     let data = /* @__PURE__ */ user_derived(() => ({
       ticketSelection: get$2(ticketSelectionDetails),
       personalizationDetails: get$2(personalizationDetails),
       formData: get$2(formDetails)?.formData,
-      cart: shop.cart
+      cart: shop.cart,
+      cartView: get$2(cartView)
     }));
     const _setData = (_data) => {
       set(data, _data);