@gomusdev/web-components 3.8.3 → 3.9.0

package/dist-js/gomus-webcomponents.js

@@ -11803,7 +11803,8 @@ function createUITicket(apiTicket, options) {
 			normal: "day",
 			annual: "annual"
 		}[apiTicket.ticket_type],
-		shop_order: apiTicket.shop_order ?? 0
+		shop_order: apiTicket.shop_order ?? 0,
+		content: void 0
 	};
 }
 function initUITimeslotTickets(tickets, selectedTime = "") {
@@ -13544,6 +13545,12 @@ var Shop = class {
 			query: assign({ per_page: 100 }, params ?? {})
 		});
 	}
+	ticketsContent(ticketIds) {
+		return this.fetchAndCache("/api/v4/tickets/content", `ticketsContent-${JSON.stringify(ticketIds)}`, "data", {
+			cache: 300,
+			query: assign({ "ticket_ids[]": ticketIds }, { per_page: 100 })
+		});
+	}
 	signIn(params) {
 		return this.apiPost(SIGN_IN_ENDPOINT, {
 			body: params,
@@ -15194,8 +15201,8 @@ function option(value) {
 var root$46 = /* @__PURE__ */ from_html(`<s class="go-cart-item-price-original"> </s> <span class="go-cart-item-price-discounted"> </span>`, 1);
 var root_1$14 = /* @__PURE__ */ from_html(`<span class="go-cart-item-price-discounted"> </span>`);
 var root_2$10 = /* @__PURE__ */ from_html(`<span> </span>`);
-var root_3$6 = /* @__PURE__ */ from_html(`<option> </option>`);
-var root_4$3 = /* @__PURE__ */ from_html(`<select class="go-cart-item-select"></select>`);
+var root_3$7 = /* @__PURE__ */ from_html(`<option> </option>`);
+var root_4$4 = /* @__PURE__ */ from_html(`<select class="go-cart-item-select"></select>`);
 var root_5$2 = /* @__PURE__ */ from_html(`<li class="go-cart-item-remove"><button class="go-cart-remove">⨉</button></li>`);
 var root_6$2 = /* @__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) {
@@ -15317,9 +15324,9 @@ function Item$1($$anchor, $$props) {
 			append($$anchor, span_2);
 		};
 		var alternate_1 = ($$anchor) => {
-			var select = root_4$3();
+			var select = root_4$4();
 			each(select, 21, () => generateQuantityOptions(get$2(capacity).min, get$2(capacity).max, { floor: 1 }), (q) => q.value, ($$anchor, q) => {
-				var option = root_3$6();
+				var option = root_3$7();
 				var text_4 = child(option, true);
 				reset(option);
 				var option_value = {};
@@ -30304,8 +30311,8 @@ var rest_excludes = new Set([
 var root$15 = /* @__PURE__ */ from_html(`<span class="go-field-star" aria-hidden="true">*</span>`);
 var root_1$7 = /* @__PURE__ */ from_html(` <!>`, 1);
 var root_2$6 = /* @__PURE__ */ from_html(`<label><!></label> <input/>`, 1);
-var root_3$5 = /* @__PURE__ */ from_html(`<label><!></label> <textarea></textarea>`, 1);
-var root_4$2 = /* @__PURE__ */ from_html(`<figure role="status" aria-live="polite"><img class="go-file-preview"/> <figcaption class="go-file-preview-caption"> </figcaption></figure>`);
+var root_3$6 = /* @__PURE__ */ from_html(`<label><!></label> <textarea></textarea>`, 1);
+var root_4$3 = /* @__PURE__ */ from_html(`<figure role="status" aria-live="polite"><img class="go-file-preview"/> <figcaption class="go-file-preview-caption"> </figcaption></figure>`);
 var root_5$1 = /* @__PURE__ */ from_html(`<label><!></label> <input/> <!>`, 1);
 var root_6$1 = /* @__PURE__ */ from_html(`<label><input/> <span class="go-checkbox-label"><!></span></label>`);
 var root_7$1 = /* @__PURE__ */ from_html(`<img src="" alt=""/> <option> </option>`, 1);
@@ -30356,7 +30363,7 @@ function InputAndLabel($$anchor, $$props) {
 		append($$anchor, fragment_1);
 	};
 	const textarea = ($$anchor) => {
-		var fragment_2 = root_3$5();
+		var fragment_2 = root_3$6();
 		var label_2 = first_child(fragment_2);
 		labelText(child(label_2));
 		reset(label_2);
@@ -30399,7 +30406,7 @@ function InputAndLabel($$anchor, $$props) {
 		}), void 0, void 0, void 0, void 0, true);
 		var node_4 = sibling(input_2, 2);
 		var consequent_1 = ($$anchor) => {
-			var figure = root_4$2();
+			var figure = root_4$3();
 			var img = child(figure);
 			var figcaption = sibling(img, 2);
 			var text_1 = child(figcaption, true);
@@ -30716,7 +30723,7 @@ create_custom_element(InputAndLabel, {
 var root$14 = /* @__PURE__ */ from_html(`<span> </span>`);
 var root_1$6 = /* @__PURE__ */ from_html(`<li> </li>`);
 var root_2$5 = /* @__PURE__ */ from_html(`<ul class="go-field-errors"></ul>`);
-var root_3$4 = /* @__PURE__ */ from_html(`<!> <!> <!>`, 1);
+var root_3$5 = /* @__PURE__ */ from_html(`<!> <!> <!>`, 1);
 function Field($$anchor, $$props) {
 	push($$props, true);
 	let key = prop($$props, "key", 7), required = prop($$props, "required", 7, false), labelClass = prop($$props, "labelClass", 7), inputClass = prop($$props, "inputClass", 7);
@@ -30774,7 +30781,7 @@ function Field($$anchor, $$props) {
 			flushSync();
 		}
 	};
-	var fragment = root_3$4();
+	var fragment = root_3$5();
 	var node = first_child(fragment);
 	InputAndLabel(node, {
 		get describedByIds() {
@@ -30874,7 +30881,7 @@ customElements.define("go-all-fields", create_custom_element(AllFields, {}, [],
 var root$12 = /* @__PURE__ */ from_html(`<p aria-hidden="true"> </p>`);
 var root_1$5 = /* @__PURE__ */ from_html(`<li> </li>`);
 var root_2$4 = /* @__PURE__ */ from_html(`<ul class="go-error-feedback-api-errors"></ul>`);
-var root_3$3 = /* @__PURE__ */ from_html(`<div><p aria-live="assertive" class="sr-only"><!></p> <!> <!></div>`);
+var root_3$4 = /* @__PURE__ */ from_html(`<div><p aria-live="assertive" class="sr-only"><!></p> <!> <!></div>`);
 function ErrorsFeedback($$anchor, $$props) {
 	push($$props, true);
 	const _details = getDetails$1($$props.$$host);
@@ -30895,7 +30902,7 @@ function ErrorsFeedback($$anchor, $$props) {
 		$$props.$$host.classList.toggle("go-feedback", true);
 		$$props.$$host.setAttribute("data-num-errors", get$2(numErrors).toString());
 	});
-	var div = root_3$3();
+	var div = root_3$4();
 	var p = child(div);
 	var node = child(p);
 	var consequent = ($$anchor) => {
@@ -32436,6 +32443,33 @@ var FILTER_NAMES = [
 //#region src/components/ticketSelection/filters/_helpers.ts
 var TWO_HOURS_MS = 7200 * 1e3;
 /**
+* When a segment opts into content attributes (with-content), batch-fetch
+* tickets/content for the given tickets and merge each entry's `content` onto
+* the matching ticket by id (mirrors the legacy `ticket.content = item.content`).
+* Mutates the tickets in place; call before adding them to the preCart so the
+* content is present on first render. No-op — and no request — when the segment
+* hasn't enabled the feature or there are no tickets to enrich.
+*
+* Best-effort: the content is an optional, additive sidecar, so a failed or
+* absent fetch degrades to "no info buttons" and must never empty the ticket
+* list (see audit finding IB-01). Note this does NOT cover a hung request — a
+* never-settling fetch is a separate core-infra concern (IB-05).
+*/
+async function enrichTicketsWithContent(segment, tickets) {
+	if (!segment.withContent) return;
+	const ids = tickets.map((t) => t.id).filter((id) => typeof id === "number");
+	if (!ids.length) return;
+	try {
+		const entries = await shop.asyncFetch(() => shop.ticketsContent(ids)) ?? [];
+		const byId = new Map(entries.map((e) => [e.id, e.content]));
+		for (const ticket of tickets) {
+			if (typeof ticket.id !== "number") continue;
+			const content = byId.get(ticket.id);
+			if (content) ticket.content = content;
+		}
+	} catch {}
+}
+/**
 * Load quotas fetched by a filter's loadTimeslots into the shared quota store and
 * record which ticket ids this selection loaded for its picker. timeslotsOn() reads
 * tsd.timeslotTicketIds, so only these tickets' slots render — a foreign
@@ -32511,6 +32545,7 @@ var REGISTRY = {
 			}));
 			shop.capacityManager.addQuotas(quotas);
 			const uiTickets = initUITimeslotTickets(filterAvailabletickets(tickets, tsd.selectedTime), tsd.selectedTime);
+			await enrichTicketsWithContent(segment, uiTickets);
 			for (const ticket of uiTickets) segment.preCart.addItem(createCartItem(ticket, { time: tsd.selectedTime }));
 		}
 	},
@@ -32542,6 +32577,7 @@ var REGISTRY = {
 			const firstQuota = Object.values(quotas)[0];
 			const timeslot = firstQuota ? Object.keys(firstQuota.capacities)[0] : void 0;
 			const uiTickets = initUITimeslotTickets(filterAvailabletickets(tickets, timeslot), timeslot);
+			await enrichTicketsWithContent(segment, uiTickets);
 			for (const ticket of uiTickets) segment.preCart.addItem(createCartItem(ticket, { time: timeslot }));
 		}
 	},
@@ -32563,7 +32599,9 @@ var REGISTRY = {
 				"by_ticket_ids[]": tsd.ticketIds,
 				"by_ticket_group_ids[]": segment.ticketGroupIds ?? tsd.ticketGroupIds
 			}));
-			for (const t of Object.values(tickets)) segment.preCart.addItem(createCartItem(createUITicket(t)));
+			const uiTickets = Object.values(tickets).map((t) => createUITicket(t));
+			await enrichTicketsWithContent(segment, uiTickets);
+			for (const ticket of uiTickets) segment.preCart.addItem(createCartItem(ticket));
 		}
 	},
 	"event:admission": {
@@ -32602,6 +32640,7 @@ var REGISTRY = {
 			}));
 			shop.capacityManager.addQuotas(quotas);
 			const uiTickets = initUITimeslotTickets(filterAvailabletickets(tickets, tsd.selectedTime), tsd.selectedTime);
+			await enrichTicketsWithContent(segment, uiTickets);
 			for (const ticket of uiTickets) segment.preCart.addItem(createCartItem(ticket, { time: tsd.selectedTime }));
 		}
 	},
@@ -32634,6 +32673,7 @@ var REGISTRY = {
 			const firstQuota = Object.values(quotas)[0];
 			const time = firstQuota ? Object.keys(firstQuota.capacities)[0] : void 0;
 			const uiTickets = initUITimeslotTickets(filterAvailabletickets(tickets, time), time);
+			await enrichTicketsWithContent(segment, uiTickets);
 			for (const t of uiTickets) segment.preCart.addItem(createCartItem(t, { time }));
 		}
 	},
@@ -32682,6 +32722,7 @@ var REGISTRY = {
 			}));
 			shop.capacityManager.addQuotas(quotas);
 			const uiTickets = initUITimeslotTickets(filterAvailabletickets(tickets, tsd.selectedTime), tsd.selectedTime);
+			await enrichTicketsWithContent(segment, uiTickets);
 			for (const t of uiTickets) segment.preCart.addItem(createCartItem(t, { time: tsd.selectedTime }));
 		}
 	},
@@ -32749,6 +32790,7 @@ var REGISTRY = {
 				}));
 				shop.capacityManager.addQuotas(quotas);
 				const uiTickets = initUITimeslotTickets(filterAvailabletickets(tickets, date.start_time), date.start_time);
+				await enrichTicketsWithContent(segment, uiTickets);
 				for (const ticket of uiTickets) segment.preCart.addItem(createCartItem(ticket, { time: date.start_time }));
 			}
 		}
@@ -32794,6 +32836,7 @@ var REGISTRY = {
 				const firstQuota = Object.values(quotas)[0];
 				const time = firstQuota ? Object.keys(firstQuota.capacities)[0] : date.start_time;
 				const uiTickets = initUITimeslotTickets(filterAvailabletickets(tickets, time), time);
+				await enrichTicketsWithContent(segment, uiTickets);
 				for (const t of uiTickets) segment.preCart.addItem(createCartItem(t, { time }));
 			}
 		}
@@ -32837,6 +32880,7 @@ var REGISTRY = {
 				}));
 				shop.capacityManager.addQuotas(quotas);
 				const uiTickets = initUITimeslotTickets(filterAvailabletickets(tickets, date.start_time), date.start_time);
+				await enrichTicketsWithContent(segment, uiTickets);
 				for (const t of uiTickets) segment.preCart.addItem(createCartItem(t, { time: date.start_time }));
 			}
 		}
@@ -33286,7 +33330,7 @@ customElements.define("go-order", create_custom_element(Order, { token: {
 var root$9 = /* @__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_1$4 = /* @__PURE__ */ from_html(`<br/> <span class="go-order-item-quantities"> </span>`, 1);
 var root_2$3 = /* @__PURE__ */ from_html(`<a aria-label="iCal link"> </a>`);
-var root_3$2 = /* @__PURE__ */ from_html(`<li><article><ul><li class="go-order-breakdown-count">1</li> <li class="go-order-breakdown-product"><span class="go-order-item-title"> </span> <!> <!> <a class="go-ticket-download" target="_blank" rel="noopener noreferrer"> </a></li> <li class="go-order-breakdown-item-price"> </li> <li class="go-order-breakdown-passbook"></li> <li class="go-order-breakdown-ical"><!></li></ul></article></li>`);
+var root_3$3 = /* @__PURE__ */ from_html(`<li><article><ul><li class="go-order-breakdown-count">1</li> <li class="go-order-breakdown-product"><span class="go-order-item-title"> </span> <!> <!> <a class="go-ticket-download" target="_blank" rel="noopener noreferrer"> </a></li> <li class="go-order-breakdown-item-price"> </li> <li class="go-order-breakdown-passbook"></li> <li class="go-order-breakdown-ical"><!></li></ul></article></li>`);
 function Event$1($$anchor, $$props) {
 	push($$props, true);
 	let item = prop($$props, "item", 7), orderDetails = prop($$props, "orderDetails", 7);
@@ -33306,7 +33350,7 @@ function Event$1($$anchor, $$props) {
 			flushSync();
 		}
 	};
-	var li = root_3$2();
+	var li = root_3$3();
 	var article = child(li);
 	var ul = child(article);
 	var li_1 = sibling(child(ul), 2);
@@ -33391,8 +33435,8 @@ create_custom_element(Event$1, {
 var root$8 = /* @__PURE__ */ from_html(`<span class="go-cart-item-date"> </span> <span class="go-cart-item-time"> </span>`, 1);
 var root_1$3 = /* @__PURE__ */ from_html(`<span class="go-cart-item-date"> </span>`);
 var root_2$2 = /* @__PURE__ */ from_html(`<!> <br/> <a class="go-ticket-download" target="_blank" rel="noopener noreferrer"> </a>`, 1);
-var root_3$1 = /* @__PURE__ */ from_html(`<br/> <a class="go-ticket-personalization"> </a>`, 1);
-var root_4$1 = /* @__PURE__ */ from_html(`<a aria-label="passbook link"><img alt="apple wallet icon"/></a>`);
+var root_3$2 = /* @__PURE__ */ from_html(`<br/> <a class="go-ticket-personalization"> </a>`, 1);
+var root_4$2 = /* @__PURE__ */ from_html(`<a aria-label="passbook link"><img alt="apple wallet icon"/></a>`);
 var root_5 = /* @__PURE__ */ from_html(`<a aria-label="iCal link"> </a>`);
 var root_6 = /* @__PURE__ */ from_html(`<li><article><ul><li class="go-order-breakdown-count"></li> <li class="go-order-breakdown-product"><span class="go-order-item-title"> </span> <!></li> <li class="go-order-breakdown-item-price"> </li> <li class="go-order-breakdown-passbook"><!></li> <li class="go-order-breakdown-ical"><!></li></ul></article></li>`);
 var root_7 = /* @__PURE__ */ from_html(`<a class="go-ticket-download" target="_blank" rel="noopener noreferrer"> </a>`);
@@ -33478,7 +33522,7 @@ function TicketSale($$anchor, $$props) {
 				append($$anchor, fragment_2);
 			};
 			var alternate = ($$anchor) => {
-				var fragment_4 = root_3$1();
+				var fragment_4 = root_3$2();
 				var a_1 = sibling(first_child(fragment_4), 2);
 				var text_5 = child(a_1, true);
 				reset(a_1);
@@ -33499,7 +33543,7 @@ function TicketSale($$anchor, $$props) {
 			var li_4 = sibling(li_3, 2);
 			var node_4 = child(li_4);
 			var consequent_3 = ($$anchor) => {
-				var a_2 = root_4$1();
+				var a_2 = root_4$2();
 				var img = child(a_2);
 				reset(a_2);
 				template_effect(() => {
@@ -34085,6 +34129,13 @@ var SegmentDetails = class {
 	set museumIds(value) {
 		set(this.#museumIds, value, true);
 	}
+	#withContent = /* @__PURE__ */ state(false);
+	get withContent() {
+		return get$2(this.#withContent);
+	}
+	set withContent(value) {
+		set(this.#withContent, value, true);
+	}
 	constructor(filters, tsdWrapper) {
 		this.filters = filters === void 0 ? void 0 : Array.isArray(filters) ? filters : [filters];
 		this.#ticketSelectionDetails = /* @__PURE__ */ user_derived(() => tsdWrapper.value);
@@ -34115,7 +34166,7 @@ var getSegmentDetails = createGetDetails(KEY);
 //#region src/components/ticketSelection/subcomponents/tickets/subcomponents/segment/TicketSegment.svelte
 function TicketSegment($$anchor, $$props) {
 	push($$props, true);
-	const filters = prop($$props, "filters", 7), dateId = prop($$props, "dateId", 7), query = prop($$props, "query", 7), limit = prop($$props, "limit", 7), ticketGroupIds = prop($$props, "ticketGroupIds", 7), languageIds = prop($$props, "languageIds", 7), catchWordIds = prop($$props, "catchWordIds", 7), museumIds = prop($$props, "museumIds", 7);
+	const filters = prop($$props, "filters", 7), dateId = prop($$props, "dateId", 7), query = prop($$props, "query", 7), limit = prop($$props, "limit", 7), ticketGroupIds = prop($$props, "ticketGroupIds", 7), languageIds = prop($$props, "languageIds", 7), catchWordIds = prop($$props, "catchWordIds", 7), museumIds = prop($$props, "museumIds", 7), withContent = prop($$props, "withContent", 7);
 	function parseFilters(value) {
 		if (!value) return void 0;
 		const out = value.split(",").map((s) => s.trim()).filter(Boolean);
@@ -34134,6 +34185,7 @@ function TicketSegment($$anchor, $$props) {
 		details.languageIds = parseIds(languageIds());
 		details.catchWordIds = parseIds(catchWordIds());
 		details.museumIds = parseIds(museumIds());
+		details.withContent = Boolean(withContent());
 	});
 	user_effect(() => {
 		details.dateId;
@@ -34144,6 +34196,7 @@ function TicketSegment($$anchor, $$props) {
 		details.catchWordIds;
 		details.query;
 		details.limit;
+		details.withContent;
 		tsd?.filters;
 		tsd?.selectedTimeslot;
 		tsd?.selectedTime;
@@ -34218,6 +34271,13 @@ function TicketSegment($$anchor, $$props) {
 		set museumIds($$value) {
 			museumIds($$value);
 			flushSync();
+		},
+		get withContent() {
+			return withContent();
+		},
+		set withContent($$value) {
+			withContent($$value);
+			flushSync();
 		}
 	});
 }
@@ -34261,6 +34321,11 @@ customElements.define("go-ticket-segment", create_custom_element(TicketSegment,
 		attribute: "museum-ids",
 		reflect: true,
 		type: "String"
+	},
+	withContent: {
+		attribute: "with-content",
+		reflect: true,
+		type: "Boolean"
 	}
 }, [], ["details"]));
 //#endregion
@@ -36131,9 +36196,12 @@ var purify = createDOMPurify();
 //#endregion
 //#region src/components/ticketSelection/subcomponents/tickets/subcomponents/segment/Item.svelte
 var root$3 = /* @__PURE__ */ from_html(`<span class="go-tickets-item-title-event-title"> </span> <span class="go-tickets-item-title-product-title"> </span>`, 1);
-var root_1$2 = /* @__PURE__ */ from_html(`<option> </option>`);
-var root_2$1 = /* @__PURE__ */ from_html(`<li><article><ul><li class="go-tickets-item-title"><!></li> <li class="go-tickets-item-description" data-go-tickets-description=""></li> <li class="go-tickets-item-price" data-go-tickets-price=""> </li> <li class="go-tickets-item-quality" data-go-tickets-quality=""><select class="go-tickets-item-select"></select></li></ul></article></li>`);
+var root_1$2 = /* @__PURE__ */ from_html(`<li class="go-tickets-item-info"><button type="button" data-testid="ticket-info-toggle"></button></li>`);
+var root_2$1 = /* @__PURE__ */ from_html(`<li class="go-ticket-additional-info" data-testid="ticket-additional-info"> </li>`);
+var root_3$1 = /* @__PURE__ */ from_html(`<option> </option>`);
+var root_4$1 = /* @__PURE__ */ from_html(`<li><article><ul><li class="go-tickets-item-title"><!></li> <!> <li class="go-tickets-item-description" data-go-tickets-description=""></li> <!> <li class="go-tickets-item-price" data-go-tickets-price=""> </li> <li class="go-tickets-item-quality" data-go-tickets-quality=""><select class="go-tickets-item-select"></select></li></ul></article></li>`);
 function Item($$anchor, $$props) {
+	const uid = props_id();
 	push($$props, true);
 	const scaled_title = ($$anchor) => {
 		var fragment = root$3();
@@ -36157,6 +36225,9 @@ function Item($$anchor, $$props) {
 	};
 	let item = prop($$props, "item", 7), details = prop($$props, "details", 7);
 	let capacity = /* @__PURE__ */ state(void 0);
+	let infoExpanded = /* @__PURE__ */ state(false);
+	const reductionReason = /* @__PURE__ */ user_derived(() => item().product?.content?.reduction_reason);
+	const infoPanelId = `go-ticket-info-${uid}`;
 	user_effect(() => {
 		details().preCart.items.map((i) => i.quantity);
 		untrack(() => {
@@ -36186,55 +36257,87 @@ function Item($$anchor, $$props) {
 	};
 	var fragment_2 = comment();
 	var node = first_child(fragment_2);
-	var consequent = ($$anchor) => {
-		var li = root_2$1();
+	var consequent_2 = ($$anchor) => {
+		var li = root_4$1();
 		var article = child(li);
 		var ul = child(article);
 		var li_1 = child(ul);
 		var node_1 = child(li_1);
 		titleSnippet(node_1);
 		reset(li_1);
-		var li_2 = sibling(li_1, 2);
-		html$2(li_2, () => purify.sanitize(item().product.description), true);
-		reset(li_2);
-		var li_3 = sibling(li_2, 2);
-		var text_3 = child(li_3, true);
+		var node_2 = sibling(li_1, 2);
+		var consequent = ($$anchor) => {
+			var li_2 = root_1$2();
+			var button = child(li_2);
+			reset(li_2);
+			template_effect(($0) => {
+				set_class(button, 1, clsx(["go-ticket-info-icon", get$2(infoExpanded) && "is-active"]));
+				set_attribute(button, "aria-expanded", get$2(infoExpanded));
+				set_attribute(button, "aria-controls", infoPanelId);
+				set_attribute(button, "aria-label", $0);
+			}, [() => shop.t("ticket.list.additionalInfo")]);
+			delegated("click", button, () => set(infoExpanded, !get$2(infoExpanded)));
+			append($$anchor, li_2);
+		};
+		if_block(node_2, ($$render) => {
+			if (get$2(reductionReason)) $$render(consequent);
+		});
+		var li_3 = sibling(node_2, 2);
+		html$2(li_3, () => purify.sanitize(item().product.description), true);
 		reset(li_3);
-		var li_4 = sibling(li_3, 2);
-		var select = child(li_4);
+		var node_3 = sibling(li_3, 2);
+		var consequent_1 = ($$anchor) => {
+			var li_4 = root_2$1();
+			var text_3 = child(li_4, true);
+			reset(li_4);
+			template_effect(($0) => {
+				set_attribute(li_4, "id", infoPanelId);
+				set_attribute(li_4, "hidden", !get$2(infoExpanded));
+				set_text(text_3, $0);
+			}, [() => shop.t(get$2(reductionReason))]);
+			append($$anchor, li_4);
+		};
+		if_block(node_3, ($$render) => {
+			if (get$2(reductionReason)) $$render(consequent_1);
+		});
+		var li_5 = sibling(node_3, 2);
+		var text_4 = child(li_5, true);
+		reset(li_5);
+		var li_6 = sibling(li_5, 2);
+		var select = child(li_6);
 		each(select, 21, () => generateQuantityOptions(get$2(capacity).min, get$2(capacity).max), (q) => q.value, ($$anchor, q) => {
-			var option = root_1$2();
-			var text_4 = child(option, true);
+			var option = root_3$1();
+			var text_5 = child(option, true);
 			reset(option);
 			var option_value = {};
 			template_effect(() => {
 				set_selected(option, item().quantity === get$2(q).value);
-				set_text(text_4, get$2(q).label);
+				set_text(text_5, get$2(q).label);
 				if (option_value !== (option_value = get$2(q).value)) option.value = (option.__value = get$2(q).value) ?? "";
 			});
 			append($$anchor, option);
 		});
 		reset(select);
-		reset(li_4);
+		reset(li_6);
 		reset(ul);
 		reset(article);
 		reset(li);
 		template_effect(($0) => {
 			set_class(article, 1, clsx(["go-tickets-item", get$2(capacity).bookedOut && "is-booked-out"]));
 			set_attribute(article, "data-testid", item().uuid);
-			set_text(text_3, item().price_formatted);
+			set_text(text_4, item().price_formatted);
 			set_attribute(select, "aria-label", $0);
 		}, [() => shop.t("cart.content.table.edit")]);
 		delegated("change", select, (e) => update(item(), e.target, details()?.ticketSelectionDetails));
 		append($$anchor, li);
 	};
 	if_block(node, ($$render) => {
-		if (get$2(capacity) && !get$2(capacity).unavailable) $$render(consequent);
+		if (get$2(capacity) && !get$2(capacity).unavailable) $$render(consequent_2);
 	});
 	append($$anchor, fragment_2);
 	return pop($$exports);
 }
-delegate(["change"]);
+delegate(["click", "change"]);
 create_custom_element(Item, {
 	item: {},
 	details: {}