@gomusdev/web-components 0.0.7 → 0.0.8

package/README.md

@@ -1,3 +1,6 @@
-# TODO
+# Changelog
 
-# WRITE ME
+## 0.0.8
+- When `go-ticket-selection` filter is `annual`, should correctly show the annual tickets
+- Hide `go-calendar` and `go-timeslots` when filter is `annual`
+- Hide `go-timeslots` when filter is `normal`

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

@@ -5592,6 +5592,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
   }
   const TICKETS_CALENDAR_ENDPOINT = "/api/v4/tickets/calendar";
   const TICKET_AND_QUOTAS_ENDPOINT = "/api/v4/tickets/list_and_quotas";
+  const TICKETS_ENDPOINT = "/api/v4/tickets";
   var util;
   (function(util2) {
     util2.assertEqual = (val) => val;
@@ -9525,40 +9526,6 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     start_at: z.string().date(),
     personalizations: z.array(PersonalizationSchema)
   });
-  const isObject$1 = (value) => {
-    return !!value && value.constructor === Object;
-  };
-  const sort = (array, getter, desc = false) => {
-    if (!array)
-      return [];
-    const asc = (a, b) => getter(a) - getter(b);
-    const dsc = (a, b) => getter(b) - getter(a);
-    return array.slice().sort(desc === true ? dsc : asc);
-  };
-  const alphabetical = (array, getter, dir = "asc") => {
-    if (!array)
-      return [];
-    const asc = (a, b) => `${getter(a)}`.localeCompare(getter(b));
-    const dsc = (a, b) => `${getter(b)}`.localeCompare(getter(a));
-    return array.slice().sort(dir === "desc" ? dsc : asc);
-  };
-  const assign = (initial, override) => {
-    if (!initial || !override)
-      return initial ?? override ?? {};
-    return Object.entries({ ...initial, ...override }).reduce(
-      (acc, [key, value]) => {
-        return {
-          ...acc,
-          [key]: (() => {
-            if (isObject$1(initial[key]))
-              return assign(initial[key], value);
-            return value;
-          })()
-        };
-      },
-      {}
-    );
-  };
   function $2b4dce13dd5a17fa$export$842a2cf37af977e1(amount, numerator) {
     return amount - numerator * Math.floor(amount / numerator);
   }
@@ -10763,6 +10730,40 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
       })
     ];
   }
+  const isObject$1 = (value) => {
+    return !!value && value.constructor === Object;
+  };
+  const sort = (array, getter, desc = false) => {
+    if (!array)
+      return [];
+    const asc = (a, b) => getter(a) - getter(b);
+    const dsc = (a, b) => getter(b) - getter(a);
+    return array.slice().sort(desc === true ? dsc : asc);
+  };
+  const alphabetical = (array, getter, dir = "asc") => {
+    if (!array)
+      return [];
+    const asc = (a, b) => `${getter(a)}`.localeCompare(getter(b));
+    const dsc = (a, b) => `${getter(b)}`.localeCompare(getter(a));
+    return array.slice().sort(dir === "desc" ? dsc : asc);
+  };
+  const assign = (initial, override) => {
+    if (!initial || !override)
+      return initial ?? override ?? {};
+    return Object.entries({ ...initial, ...override }).reduce(
+      (acc, [key, value]) => {
+        return {
+          ...acc,
+          [key]: (() => {
+            if (isObject$1(initial[key]))
+              return assign(initial[key], value);
+            return value;
+          })()
+        };
+      },
+      {}
+    );
+  };
   class GomusTicket {
     constructor(ticketObject, minAvailableCapacity = 0, selectedTime = "", quantity) {
       __publicField(this, "id");
@@ -10866,6 +10867,66 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     });
     return sort(Object.values(tmpTickets), (f) => f.shopOrder);
   }
+  class GomusAnnualTicket {
+    constructor(ticketObject, minAvailableCapacity = 0, selectedTime = "", quantity) {
+      __publicField(this, "id");
+      __publicField(this, "title");
+      __publicField(this, "description");
+      __publicField(this, "type");
+      __publicField(this, "selectedTime");
+      __publicField(this, "_quantity", 0);
+      __publicField(this, "quantityOptions");
+      __publicField(this, "vatPct");
+      __publicField(this, "priceCents");
+      __publicField(this, "priceFormatted");
+      __publicField(this, "totalPriceCents");
+      __publicField(this, "totalPriceFormatted");
+      __publicField(this, "minQuantity");
+      __publicField(this, "maxQuantity");
+      __publicField(this, "maxPersons");
+      __publicField(this, "shopOrder");
+      __publicField(this, "minAvailableCapacity");
+      __publicField(this, "reductionReason");
+      __publicField(this, "ticketObject");
+      this.ticketObject = ticketObject;
+      this.minAvailableCapacity = minAvailableCapacity;
+      this.id = ticketObject.id;
+      this.title = ticketObject.title;
+      this.description = ticketObject.description;
+      this.type = "annual";
+      this.selectedTime = selectedTime;
+      this.vatPct = ticketObject.vat_pct;
+      if (ticketObject.tax_included) {
+        this.priceCents = ticketObject.price_cents;
+      } else {
+        this.priceCents = ticketObject.price_cents * (1 + this.vatPct / 100);
+      }
+      this.priceFormatted = formatCurrency(this.priceCents);
+      this.quantity = quantity || 0;
+      this.minQuantity = ticketObject.min_persons;
+      this.maxPersons = ticketObject.max_persons;
+      this.quantityOptions = generateQuantityOptions(this.minQuantity, this.maxPersons);
+      this.shopOrder = ticketObject.shop_order ? ticketObject.shop_order : 0;
+    }
+    set quantity(value) {
+      this._quantity = value;
+      this.updateTotalPrices();
+    }
+    get quantity() {
+      return this._quantity;
+    }
+    updateTotalPrices() {
+      this.totalPriceCents = this.quantity * this.priceCents;
+      this.totalPriceFormatted = formatCurrency(this.totalPriceCents);
+    }
+  }
+  function initAnnualTickets(tickets) {
+    const tmpTickets = {};
+    Object.keys(tickets).forEach((ticketId) => {
+      if (tickets[ticketId]) tmpTickets[ticketId] = new GomusAnnualTicket(tickets[ticketId]);
+    });
+    return sort(Object.values(tmpTickets), (f) => f.shopOrder);
+  }
   class Shop {
     constructor(apiUrl, shopDomain, locale, type = "angular") {
       __privateAdd(this, _Shop_instances);
@@ -10990,6 +11051,9 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     ticketsAndQuotas(params) {
       return this.fetchAndCache(TICKET_AND_QUOTAS_ENDPOINT, `ticketsAndQuotas-${JSON.stringify(params)}`, "", { cache: 60, query: params });
     }
+    tickets(params) {
+      return this.fetchAndCache(TICKETS_ENDPOINT, `tickets-${JSON.stringify(params)}`, "", { cache: 60, query: params });
+    }
     /**
      * Returns a reactive value that will contain the fetched data, no need to await.
      *
@@ -13839,7 +13903,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
   };
   _props12 = new WeakMap();
   let CalendarHeaderState = _CalendarHeaderState;
-  var root_2$e = /* @__PURE__ */ from_html(`<div><!></div>`);
+  var root_2$g = /* @__PURE__ */ from_html(`<div><!></div>`);
   function Calendar$2($$anchor, $$props) {
     push($$props, true);
     let child$1 = prop($$props, "child", 7), children = prop($$props, "children", 7), id = prop($$props, "id", 23, useId), ref = prop($$props, "ref", 15, null), value = prop($$props, "value", 15), onValueChange = prop($$props, "onValueChange", 7, noop), placeholder = prop($$props, "placeholder", 15), onPlaceholderChange = prop($$props, "onPlaceholderChange", 7, noop), weekdayFormat = prop($$props, "weekdayFormat", 7, "narrow"), weekStartsOn = prop($$props, "weekStartsOn", 7), pagedNavigation = prop($$props, "pagedNavigation", 7, false), isDateDisabled = prop($$props, "isDateDisabled", 7, () => false), isDateUnavailable = prop($$props, "isDateUnavailable", 7, () => false), fixedWeeks = prop($$props, "fixedWeeks", 7, false), numberOfMonths = prop($$props, "numberOfMonths", 7, 1), locale = prop($$props, "locale", 7), calendarLabel = prop($$props, "calendarLabel", 7, "Event"), disabled = prop($$props, "disabled", 7, false), readonly = prop($$props, "readonly", 7, false), minValue = prop($$props, "minValue", 7, void 0), maxValue = prop($$props, "maxValue", 7, void 0), preventDeselect = prop($$props, "preventDeselect", 7, false), type = prop($$props, "type", 7), disableDaysOutsideMonth = prop($$props, "disableDaysOutsideMonth", 7, true), initialFocus = prop($$props, "initialFocus", 7, false), maxDays = prop($$props, "maxDays", 7), monthFormat = prop($$props, "monthFormat", 7, "long"), yearFormat = prop($$props, "yearFormat", 7, "numeric"), restProps = /* @__PURE__ */ rest_props($$props, [
@@ -13940,7 +14004,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate = ($$anchor2) => {
-        var div = root_2$e();
+        var div = root_2$g();
         attribute_effect(div, () => ({ ...get(mergedProps) }));
         var node_2 = child(div);
         snippet(node_2, () => children() ?? noop$1, () => rootState.snippetProps);
@@ -14188,7 +14252,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     [],
     true
   );
-  var root_2$d = /* @__PURE__ */ from_html(`<div><!></div>`);
+  var root_2$f = /* @__PURE__ */ from_html(`<div><!></div>`);
   function Calendar_day($$anchor, $$props) {
     const uid = props_id();
     push($$props, true);
@@ -14220,7 +14284,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate_1 = ($$anchor2) => {
-        var div = root_2$d();
+        var div = root_2$f();
         attribute_effect(div, () => ({ ...get(mergedProps) }));
         var node_2 = child(div);
         {
@@ -14281,7 +14345,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     });
   }
   create_custom_element(Calendar_day, { children: {}, child: {}, ref: {}, id: {} }, [], [], true);
-  var root_2$c = /* @__PURE__ */ from_html(`<table><!></table>`);
+  var root_2$e = /* @__PURE__ */ from_html(`<table><!></table>`);
   function Calendar_grid($$anchor, $$props) {
     const uid = props_id();
     push($$props, true);
@@ -14310,7 +14374,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate = ($$anchor2) => {
-        var table = root_2$c();
+        var table = root_2$e();
         attribute_effect(table, () => ({ ...get(mergedProps) }));
         var node_2 = child(table);
         snippet(node_2, () => children() ?? noop$1);
@@ -14355,7 +14419,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     });
   }
   create_custom_element(Calendar_grid, { children: {}, child: {}, ref: {}, id: {} }, [], [], true);
-  var root_2$b = /* @__PURE__ */ from_html(`<tbody><!></tbody>`);
+  var root_2$d = /* @__PURE__ */ from_html(`<tbody><!></tbody>`);
   function Calendar_grid_body($$anchor, $$props) {
     const uid = props_id();
     push($$props, true);
@@ -14384,7 +14448,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate = ($$anchor2) => {
-        var tbody = root_2$b();
+        var tbody = root_2$d();
         attribute_effect(tbody, () => ({ ...get(mergedProps) }));
         var node_2 = child(tbody);
         snippet(node_2, () => children() ?? noop$1);
@@ -14429,7 +14493,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     });
   }
   create_custom_element(Calendar_grid_body, { children: {}, child: {}, ref: {}, id: {} }, [], [], true);
-  var root_2$a = /* @__PURE__ */ from_html(`<td><!></td>`);
+  var root_2$c = /* @__PURE__ */ from_html(`<td><!></td>`);
   function Calendar_cell($$anchor, $$props) {
     const uid = props_id();
     push($$props, true);
@@ -14465,7 +14529,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate = ($$anchor2) => {
-        var td = root_2$a();
+        var td = root_2$c();
         attribute_effect(td, () => ({ ...get(mergedProps) }));
         var node_2 = child(td);
         snippet(node_2, () => children() ?? noop$1, () => cellState.snippetProps);
@@ -14537,7 +14601,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     [],
     true
   );
-  var root_2$9 = /* @__PURE__ */ from_html(`<thead><!></thead>`);
+  var root_2$b = /* @__PURE__ */ from_html(`<thead><!></thead>`);
   function Calendar_grid_head($$anchor, $$props) {
     const uid = props_id();
     push($$props, true);
@@ -14566,7 +14630,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate = ($$anchor2) => {
-        var thead = root_2$9();
+        var thead = root_2$b();
         attribute_effect(thead, () => ({ ...get(mergedProps) }));
         var node_2 = child(thead);
         snippet(node_2, () => children() ?? noop$1);
@@ -14611,7 +14675,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     });
   }
   create_custom_element(Calendar_grid_head, { children: {}, child: {}, ref: {}, id: {} }, [], [], true);
-  var root_2$8 = /* @__PURE__ */ from_html(`<th><!></th>`);
+  var root_2$a = /* @__PURE__ */ from_html(`<th><!></th>`);
   function Calendar_head_cell($$anchor, $$props) {
     const uid = props_id();
     push($$props, true);
@@ -14640,7 +14704,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate = ($$anchor2) => {
-        var th = root_2$8();
+        var th = root_2$a();
         attribute_effect(th, () => ({ ...get(mergedProps) }));
         var node_2 = child(th);
         snippet(node_2, () => children() ?? noop$1);
@@ -14685,7 +14749,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     });
   }
   create_custom_element(Calendar_head_cell, { children: {}, child: {}, ref: {}, id: {} }, [], [], true);
-  var root_2$7 = /* @__PURE__ */ from_html(`<tr><!></tr>`);
+  var root_2$9 = /* @__PURE__ */ from_html(`<tr><!></tr>`);
   function Calendar_grid_row($$anchor, $$props) {
     const uid = props_id();
     push($$props, true);
@@ -14714,7 +14778,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate = ($$anchor2) => {
-        var tr = root_2$7();
+        var tr = root_2$9();
         attribute_effect(tr, () => ({ ...get(mergedProps) }));
         var node_2 = child(tr);
         snippet(node_2, () => children() ?? noop$1);
@@ -14759,7 +14823,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     });
   }
   create_custom_element(Calendar_grid_row, { children: {}, child: {}, ref: {}, id: {} }, [], [], true);
-  var root_2$6 = /* @__PURE__ */ from_html(`<header><!></header>`);
+  var root_2$8 = /* @__PURE__ */ from_html(`<header><!></header>`);
   function Calendar_header($$anchor, $$props) {
     const uid = props_id();
     push($$props, true);
@@ -14788,7 +14852,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate = ($$anchor2) => {
-        var header = root_2$6();
+        var header = root_2$8();
         attribute_effect(header, () => ({ ...get(mergedProps) }));
         var node_2 = child(header);
         snippet(node_2, () => children() ?? noop$1);
@@ -14833,7 +14897,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     });
   }
   create_custom_element(Calendar_header, { children: {}, child: {}, ref: {}, id: {} }, [], [], true);
-  var root_2$5 = /* @__PURE__ */ from_html(`<div><!></div>`);
+  var root_2$7 = /* @__PURE__ */ from_html(`<div><!></div>`);
   function Calendar_heading($$anchor, $$props) {
     const uid = props_id();
     push($$props, true);
@@ -14865,7 +14929,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate_1 = ($$anchor2) => {
-        var div = root_2$5();
+        var div = root_2$7();
         attribute_effect(div, () => ({ ...get(mergedProps) }));
         var node_2 = child(div);
         {
@@ -14926,7 +14990,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     });
   }
   create_custom_element(Calendar_heading, { children: {}, child: {}, ref: {}, id: {} }, [], [], true);
-  var root_2$4 = /* @__PURE__ */ from_html(`<button><!></button>`);
+  var root_2$6 = /* @__PURE__ */ from_html(`<button><!></button>`);
   function Calendar_next_button($$anchor, $$props) {
     const uid = props_id();
     push($$props, true);
@@ -14956,7 +15020,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate = ($$anchor2) => {
-        var button = root_2$4();
+        var button = root_2$6();
         attribute_effect(button, () => ({ ...get(mergedProps) }));
         var node_2 = child(button);
         snippet(node_2, () => children() ?? noop$1);
@@ -15008,7 +15072,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     });
   }
   create_custom_element(Calendar_next_button, { children: {}, child: {}, id: {}, ref: {}, tabindex: {} }, [], [], true);
-  var root_2$3 = /* @__PURE__ */ from_html(`<button><!></button>`);
+  var root_2$5 = /* @__PURE__ */ from_html(`<button><!></button>`);
   function Calendar_prev_button($$anchor, $$props) {
     const uid = props_id();
     push($$props, true);
@@ -15038,7 +15102,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, fragment_1);
       };
       var alternate = ($$anchor2) => {
-        var button = root_2$3();
+        var button = root_2$5();
         attribute_effect(button, () => ({ ...get(mergedProps) }));
         var node_2 = child(button);
         snippet(node_2, () => children() ?? noop$1);
@@ -15158,8 +15222,8 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
   var root_11 = /* @__PURE__ */ from_html(`<div> </div>`);
   var root_17 = /* @__PURE__ */ from_html(`<div></div> `, 1);
   var root_7 = /* @__PURE__ */ from_html(`<!> <!>`, 1);
-  var root_2$2 = /* @__PURE__ */ from_html(`<!> <!>`, 1);
-  var root_1$2 = /* @__PURE__ */ from_html(`<div data-calendar-wrapper=""><!></div>`);
+  var root_2$4 = /* @__PURE__ */ from_html(`<!> <!>`, 1);
+  var root_1$3 = /* @__PURE__ */ from_html(`<div data-calendar-wrapper=""><!></div>`);
   function CalendarUI($$anchor, $$props) {
     push($$props, true);
     let calendarClass = prop($$props, "calendarClass", 7);
@@ -15171,13 +15235,13 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         bubbles: true
       }));
     });
-    var div = root_1$2();
+    var div = root_1$3();
     var node = child(div);
     {
       const children = ($$anchor2, $$arg0) => {
         let months = () => $$arg0 == null ? void 0 : $$arg0().months;
         let weekdays = () => $$arg0 == null ? void 0 : $$arg0().weekdays;
-        var fragment = root_2$2();
+        var fragment = root_2$4();
         var node_1 = first_child(fragment);
         component(node_1, () => Calendar_header, ($$anchor3, Calendar_Header) => {
           Calendar_Header($$anchor3, {
@@ -15398,8 +15462,8 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         });
       };
       if_block(node, ($$render) => {
-        var _a2;
-        if (((_a2 = get(ticketSelectionDetails)) == null ? void 0 : _a2.mode) === "ticket") $$render(consequent);
+        var _a2, _b2;
+        if (((_a2 = get(ticketSelectionDetails)) == null ? void 0 : _a2.mode) === "ticket" && !((_b2 = get(ticketSelectionDetails).filters) == null ? void 0 : _b2.includes("annual"))) $$render(consequent);
       });
     }
     reset(div);
@@ -15489,8 +15553,8 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
       return generateAvailableTimeSlots(result.tickets, result.quotas);
     }
   }, _ticketSelectionDetails = new WeakMap(), _c);
-  var root_2$1 = /* @__PURE__ */ from_html(`<li><label> <input type="radio" name="timeslot"/></label></li>`);
-  var root_1$1 = /* @__PURE__ */ from_html(`<ul data-testid="timeslots" data-go-timeslots=""></ul>`);
+  var root_2$3 = /* @__PURE__ */ from_html(`<li><label> <input type="radio" name="timeslot"/></label></li>`);
+  var root_1$2 = /* @__PURE__ */ from_html(`<ul data-testid="timeslots" data-go-timeslots=""></ul>`);
   function Timeslots($$anchor, $$props) {
     push($$props, true);
     const binding_group = [];
@@ -15509,9 +15573,9 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     var node = first_child(fragment);
     {
       var consequent = ($$anchor2) => {
-        var ul = root_1$1();
+        var ul = root_1$2();
         each(ul, 20, () => details.timeslots, (timeslot) => timeslot, ($$anchor3, timeslot) => {
-          var li = root_2$1();
+          var li = root_2$3();
           var label = child(li);
           var text2 = child(label);
           var input = sibling(text2);
@@ -15543,7 +15607,8 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
         append($$anchor2, ul);
       };
       if_block(node, ($$render) => {
-        if (details.ticketSelectionDetails) $$render(consequent);
+        var _a2;
+        if (details.ticketSelectionDetails && ((_a2 = details.ticketSelectionDetails.filters) == null ? void 0 : _a2.includes("time_slot"))) $$render(consequent);
       });
     }
     append($$anchor, fragment);
@@ -15551,7 +15616,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
   }
   delegate(["change"]);
   customElements.define("go-timeslots", create_custom_element(Timeslots, {}, [], ["details"], false));
-  var root_2 = /* @__PURE__ */ from_html(`<div><!></div>`);
+  var root_2$2 = /* @__PURE__ */ from_html(`<div><!></div>`);
   var root = /* @__PURE__ */ from_html(`<!> <!>`, 1);
   function Wrapper($$anchor, $$props) {
     push($$props, true);
@@ -15584,7 +15649,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
     var node_2 = sibling(node, 2);
     {
       var consequent_1 = ($$anchor2) => {
-        var div = root_2();
+        var div = root_2$2();
         attribute_effect(div, () => ({ ...restProps }));
         var node_3 = child(div);
         snippet(node_3, children);
@@ -15739,7 +15804,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
       const museumIds = (_c2 = this.ticketSelectionDetails) == null ? void 0 : _c2.museumIds;
       const exhibitionIds = (_d = this.ticketSelectionDetails) == null ? void 0 : _d.exhibitionIds;
       const ticketIds = (_e = this.ticketSelectionDetails) == null ? void 0 : _e.ticketIds;
-      if (!date && !((_f = this.ticketSelectionDetails) == null ? void 0 : _f.selectedTimeslot)) return [];
+      if (!date && (!((_f = this.ticketSelectionDetails) == null ? void 0 : _f.selectedTimeslot) && (ticketTypes == null ? void 0 : ticketTypes.includes("time_slot")))) return [];
       const result = snapshot(shop.ticketsAndQuotas({
         by_bookable: true,
         valid_at: date == null ? void 0 : date.toString(),
@@ -15753,115 +15818,211 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
       if (!result) return [];
       return initGomusTickets(result.tickets);
     }
+    get annualTickets() {
+      var _a2, _b2;
+      const ticketTypes = (_a2 = this.ticketSelectionDetails) == null ? void 0 : _a2.filters;
+      const ticketIds = (_b2 = this.ticketSelectionDetails) == null ? void 0 : _b2.ticketIds;
+      if (!(ticketTypes == null ? void 0 : ticketTypes.includes("annual"))) return [];
+      const result = snapshot(shop.tickets({
+        by_bookable: true,
+        // @ts-ignore
+        "by_ticket_types[]": ticketTypes,
+        "by_ticket_ids[]": ticketIds,
+        locale: shop.locale
+      }));
+      if (!result) return [];
+      return initAnnualTickets(result.tickets);
+    }
   }
   _ticketSelectionDetails2 = new WeakMap();
-  var root_4 = /* @__PURE__ */ from_html(`<option> </option>`);
-  var root_3 = /* @__PURE__ */ from_html(`<tr><td><select></select></td><td><p> </p> <!></td><td> </td><td> </td></tr>`);
-  var root_1 = /* @__PURE__ */ from_html(`<table><thead><tr><th>Quantity</th><th>Ticket</th><th>Price</th><th>Total</th></tr></thead><tbody></tbody></table>`);
-  function Tickets($$anchor, $$props) {
+  var root_2$1 = /* @__PURE__ */ from_html(`<option> </option>`);
+  var root_1$1 = /* @__PURE__ */ from_html(`<tr><td><select></select></td><td><p> </p> <!></td><td> </td></tr>`);
+  function Annual($$anchor, $$props) {
     push($$props, true);
-    const details = new Details();
-    onMount(() => {
-      details.ticketSelectionDetails = getTicketSelectionDetails($$props.$$host);
+    let details = prop($$props, "details", 7);
+    var fragment = comment();
+    var node = first_child(fragment);
+    each(node, 16, () => Object.values(details().annualTickets), (ticket) => ticket, ($$anchor2, ticket) => {
+      var tr = root_1$1();
+      var td = child(tr);
+      var select = child(td);
+      each(select, 21, () => ticket.quantityOptions, index, ($$anchor3, quantity) => {
+        var option = root_2$1();
+        var text2 = child(option, true);
+        reset(option);
+        var option_value = {};
+        template_effect(() => {
+          set_selected(option, get(quantity).selected);
+          set_text(text2, get(quantity).label);
+          if (option_value !== (option_value = get(quantity).value)) {
+            option.value = (option.__value = get(quantity).value) ?? "";
+          }
+        });
+        append($$anchor3, option);
+      });
+      reset(select);
+      reset(td);
+      var td_1 = sibling(td);
+      var p = child(td_1);
+      var text_1 = child(p, true);
+      reset(p);
+      var node_1 = sibling(p, 2);
+      html(node_1, () => ticket.description);
+      reset(td_1);
+      var td_2 = sibling(td_1);
+      var text_2 = child(td_2, true);
+      reset(td_2);
+      reset(tr);
+      template_effect(
+        ($0) => {
+          set_attribute(select, "name", $0);
+          set_text(text_1, ticket.title);
+          set_text(text_2, ticket.priceFormatted);
+        },
+        [() => ticket.id.toString()]
+      );
+      append($$anchor2, tr);
     });
-    let selection = prop($$props, "selection", 7), timeslot = prop($$props, "timeslot", 7);
+    append($$anchor, fragment);
+    return pop({
+      get details() {
+        return details();
+      },
+      set details($$value) {
+        details($$value);
+        flushSync();
+      }
+    });
+  }
+  create_custom_element(Annual, { details: {} }, [], [], true);
+  var root_3 = /* @__PURE__ */ from_html(`<option> </option>`);
+  var root_2 = /* @__PURE__ */ from_html(`<tr><td><select></select></td><td><p> </p> <!></td><td> </td></tr>`);
+  function Timeslot($$anchor, $$props) {
+    push($$props, true);
+    let details = prop($$props, "details", 7);
     function hasTimeSlotInCapacities(ticket) {
       var _a2;
-      if ((_a2 = details.ticketSelectionDetails) == null ? void 0 : _a2.selectedTimeslot) {
-        return Object.keys(ticket.capacities).includes(details.ticketSelectionDetails.selectedTimeslot);
+      if ((_a2 = details().ticketSelectionDetails) == null ? void 0 : _a2.selectedTimeslot) {
+        return Object.keys(ticket.capacities).includes(details().ticketSelectionDetails.selectedTimeslot);
       } else {
         return false;
       }
     }
     var fragment = comment();
     var node = first_child(fragment);
+    each(node, 16, () => Object.values(details().tickets), (ticket) => ticket, ($$anchor2, ticket) => {
+      var fragment_1 = comment();
+      var node_1 = first_child(fragment_1);
+      {
+        var consequent = ($$anchor3) => {
+          var tr = root_2();
+          let classes;
+          var td = child(tr);
+          var select = child(td);
+          each(select, 21, () => ticket.quantityOptions, index, ($$anchor4, quantity) => {
+            var option = root_3();
+            var text2 = child(option, true);
+            reset(option);
+            var option_value = {};
+            template_effect(() => {
+              set_selected(option, get(quantity).selected);
+              set_text(text2, get(quantity).label);
+              if (option_value !== (option_value = get(quantity).value)) {
+                option.value = (option.__value = get(quantity).value) ?? "";
+              }
+            });
+            append($$anchor4, option);
+          });
+          reset(select);
+          reset(td);
+          var td_1 = sibling(td);
+          var p = child(td_1);
+          var text_1 = child(p, true);
+          reset(p);
+          var node_2 = sibling(p, 2);
+          html(node_2, () => ticket.description);
+          reset(td_1);
+          var td_2 = sibling(td_1);
+          var text_2 = child(td_2, true);
+          reset(td_2);
+          reset(tr);
+          template_effect(
+            ($0, $1) => {
+              classes = set_class(tr, 1, "", null, classes, $0);
+              set_attribute(select, "name", $1);
+              set_text(text_1, ticket.title);
+              set_text(text_2, ticket.priceFormatted);
+            },
+            [
+              () => ({ hidden: hasTimeSlotInCapacities(ticket) }),
+              () => ticket.id.toString()
+            ]
+          );
+          append($$anchor3, tr);
+        };
+        if_block(node_1, ($$render) => {
+          if (hasTimeSlotInCapacities(ticket) || ticket.type == "normal") $$render(consequent);
+        });
+      }
+      append($$anchor2, fragment_1);
+    });
+    append($$anchor, fragment);
+    return pop({
+      get details() {
+        return details();
+      },
+      set details($$value) {
+        details($$value);
+        flushSync();
+      }
+    });
+  }
+  create_custom_element(Timeslot, { details: {} }, [], [], true);
+  var root_1 = /* @__PURE__ */ from_html(`<table><thead><tr><th scope="col">Quantity</th><th scope="col">Ticket</th><th scope="col">Price</th></tr></thead><tbody><!></tbody></table>`);
+  function Tickets($$anchor, $$props) {
+    push($$props, true);
+    const details = new Details();
+    onMount(() => {
+      details.ticketSelectionDetails = getTicketSelectionDetails($$props.$$host);
+    });
+    var fragment = comment();
+    var node = first_child(fragment);
     {
       var consequent_1 = ($$anchor2) => {
         var table = root_1();
         var tbody = sibling(child(table));
-        each(tbody, 20, () => Object.values(details.tickets), (ticket) => ticket, ($$anchor3, ticket) => {
-          var fragment_1 = comment();
-          var node_1 = first_child(fragment_1);
-          {
-            var consequent = ($$anchor4) => {
-              var tr = root_3();
-              let classes;
-              var td = child(tr);
-              var select = child(td);
-              each(select, 21, () => ticket.quantityOptions, index, ($$anchor5, quantity) => {
-                var option = root_4();
-                var text2 = child(option, true);
-                reset(option);
-                var option_value = {};
-                template_effect(() => {
-                  set_selected(option, get(quantity).selected);
-                  set_text(text2, get(quantity).label);
-                  if (option_value !== (option_value = get(quantity).value)) {
-                    option.value = (option.__value = get(quantity).value) ?? "";
-                  }
-                });
-                append($$anchor5, option);
-              });
-              reset(select);
-              reset(td);
-              var td_1 = sibling(td);
-              var p = child(td_1);
-              var text_1 = child(p, true);
-              reset(p);
-              var node_2 = sibling(p, 2);
-              html(node_2, () => ticket.description);
-              reset(td_1);
-              var td_2 = sibling(td_1);
-              var text_2 = child(td_2, true);
-              reset(td_2);
-              var td_3 = sibling(td_2);
-              var text_3 = child(td_3, true);
-              reset(td_3);
-              reset(tr);
-              template_effect(
-                ($0) => {
-                  classes = set_class(tr, 1, "", null, classes, $0);
-                  set_attribute(select, "name", ticket.id);
-                  set_text(text_1, ticket.title);
-                  set_text(text_2, ticket.priceFormatted);
-                  set_text(text_3, ticket.totalPriceFormatted);
-                },
-                [() => ({ hidden: hasTimeSlotInCapacities(ticket) })]
-              );
-              append($$anchor4, tr);
-            };
-            if_block(node_1, ($$render) => {
-              if (hasTimeSlotInCapacities(ticket)) $$render(consequent);
+        var node_1 = child(tbody);
+        {
+          var consequent = ($$anchor3) => {
+            Annual($$anchor3, {
+              get details() {
+                return details;
+              }
             });
-          }
-          append($$anchor3, fragment_1);
-        });
+          };
+          var alternate = ($$anchor3) => {
+            Timeslot($$anchor3, {
+              get details() {
+                return details;
+              }
+            });
+          };
+          if_block(node_1, ($$render) => {
+            var _a2, _b2;
+            if ((_b2 = (_a2 = details.ticketSelectionDetails) == null ? void 0 : _a2.filters) == null ? void 0 : _b2.includes("annual")) $$render(consequent);
+            else $$render(alternate, false);
+          });
+        }
         reset(tbody);
         reset(table);
         append($$anchor2, table);
       };
       if_block(node, ($$render) => {
-        if (details.ticketSelectionDetails && details.ticketSelectionDetails.selectedTimeslot) $$render(consequent_1);
+        if (details.ticketSelectionDetails) $$render(consequent_1);
       });
     }
     append($$anchor, fragment);
-    return pop({
-      details,
-      get selection() {
-        return selection();
-      },
-      set selection($$value) {
-        selection($$value);
-        flushSync();
-      },
-      get timeslot() {
-        return timeslot();
-      },
-      set timeslot($$value) {
-        timeslot($$value);
-        flushSync();
-      }
-    });
+    return pop({ details });
   }
-  customElements.define("go-tickets", create_custom_element(Tickets, { selection: {}, timeslot: {} }, [], ["details"], false));
+  customElements.define("go-tickets", create_custom_element(Tickets, {}, [], ["details"], false));
 })();

package/package.json

@@ -4,7 +4,7 @@
     "name": "Giantmonkey GmbH"
   },
   "license": "MIT",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "type": "module",
   "main": "./dist-js/gomus-webcomponents.iife.js",
   "module": "./dist-js/gomus-webcomponents.iife.js",