@v-office/website-chat 1.2.0 → 1.3.0

package/dist/panel-CfS3SuRX.js

@@ -1,1396 +0,0 @@
-import { i as SESSION_TTL_S, r as MAX_MESSAGE_CHARS } from "./protocol-BuNqZAMt.js";
-import { a as House, c as TopicIcon, d as saveConversation, i as Cross, l as clearConversation, n as Check, o as Restart, p as sendMessage, r as Chevron, t as Arrow, u as loadConversation } from "./icons-BK5Lk0cP.js";
-import { r as chatCatalog, u as statePath } from "./catalog-ClcCUjf7.js";
-import { createContext, useContext, useEffect, useMemo, useRef, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { JSONUIProvider, Renderer, defineRegistry, useStateValue } from "@json-render/react";
-import { DEFAULT_MAP_STYLE_URL, partyPairs } from "@v-office/website-headless";
-//#region src/links.ts
-const withQuery = (path, pairs) => `${path}${path.includes("?") ? "&" : "?"}${new URLSearchParams(pairs)}`;
-/** The stay's dates, party and chosen rate, as the rental page and the checkout both read them. */
-const stayPairs = (stay) => [
-	["start", stay.start],
-	["end", stay.end],
-	...partyPairs(stay.party, "pets").map(([key, value]) => [key, value]),
-	...stay.policyId ? [["policy", stay.policyId]] : []
-];
-/** See {@link StayHref}. */
-const stayHref = (page, stay, searchPath) => {
-	const path = page ?? searchPath;
-	return stay ? withQuery(path, stayPairs(stay)) : path;
-};
-/** See {@link BookingHref}. */
-const bookingHref = (bookingPage, stay) => withQuery(bookingPage, [...stayPairs(stay), ...(stay.services ?? []).filter((service) => service.count > 0).map((service) => ["service", `${service.id}:${service.count}`])]);
-//#endregion
-//#region src/map.tsx
-/** MapLibre and its worker, loaded on the first tap. MapLibre finds its worker beside its own module
-*  by default; bundled, the module is a hashed chunk with nothing beside it, so `?worker&url` has the
-*  site's bundler emit the worker as one self-contained file (MapLibre's own Vite setup), and
-*  `setWorkerUrl` points MapLibre at it before the first map reads it. */
-const loadMapLibre = () => Promise.all([import("maplibre-gl"), import("maplibre-gl/dist/maplibre-gl-worker.mjs?worker&url")]).then(([library, worker]) => {
-	library.setWorkerUrl(worker.default);
-	return library;
-});
-/** What the style's sources ask to be credited, with their links, as MapLibre's attribution control
-*  would show it (OpenStreetMap's to its copyright page). */
-const Attribution = () => /* @__PURE__ */ jsxs("p", {
-	className: "map-attribution",
-	children: [
-		/* @__PURE__ */ jsx("a", {
-			href: "https://openfreemap.org",
-			target: "_blank",
-			rel: "noopener noreferrer",
-			children: "OpenFreeMap"
-		}),
-		" ",
-		/* @__PURE__ */ jsx("a", {
-			href: "https://www.openmaptiles.org/",
-			target: "_blank",
-			rel: "noopener noreferrer",
-			children: "© OpenMapTiles"
-		}),
-		" ",
-		"Data from",
-		" ",
-		/* @__PURE__ */ jsx("a", {
-			href: "https://www.openstreetmap.org/copyright",
-			target: "_blank",
-			rel: "noopener noreferrer",
-			children: "OpenStreetMap"
-		})
-	]
-});
-const MapCard = ({ rental, label, notice, load, children }) => {
-	const [shown, setShown] = useState(false);
-	const box = useRef(null);
-	const location = rental.location;
-	useEffect(() => {
-		const element = box.current;
-		if (!shown || !element || !location) return;
-		let removed = false;
-		let map;
-		loadMapLibre().then(({ Map, Marker }) => {
-			if (removed) return;
-			const center = [location.lng, location.lat];
-			const created = new Map({
-				container: element,
-				style: DEFAULT_MAP_STYLE_URL,
-				center,
-				zoom: 13,
-				attributionControl: false,
-				scrollZoom: false
-			});
-			const pin = document.createElement("span");
-			pin.className = "map-pin";
-			new Marker({ element: pin }).setLngLat(center).addTo(created);
-			map = created;
-		}).catch(() => {
-			if (!removed) setShown(false);
-		});
-		return () => {
-			removed = true;
-			map?.remove();
-		};
-	}, [shown, location]);
-	if (!location) return null;
-	return /* @__PURE__ */ jsxs("article", {
-		className: "card map-card",
-		children: [shown ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
-			ref: box,
-			className: "map",
-			role: "group",
-			"aria-label": label
-		}), /* @__PURE__ */ jsx(Attribution, {})] }) : /* @__PURE__ */ jsxs("div", {
-			className: "map-gate",
-			children: [/* @__PURE__ */ jsx("p", {
-				className: "muted",
-				children: notice
-			}), /* @__PURE__ */ jsx("button", {
-				type: "button",
-				className: "button",
-				onClick: () => setShown(true),
-				children: load
-			})]
-		}), children]
-	});
-};
-//#endregion
-//#region src/registry.tsx
-const ChatContext = createContext(null);
-const useChat = () => {
-	const value = useContext(ChatContext);
-	if (!value) throw new Error("A chat component rendered outside the chat panel.");
-	return value;
-};
-/** A stay from the state; with a `rentalId`, only a stay of that rental, so a price never shows
-*  under another rental's name, whatever a spec pairs. */
-const useStay = (stayId, rentalId) => {
-	const stay = useStateValue(statePath("stays", stayId ?? "")) ?? null;
-	return stay && (rentalId === void 0 || stay.rentalId === rentalId) ? stay : null;
-};
-const useRental = (rentalId) => useStateValue(statePath("rentals", rentalId)) ?? null;
-const day = (value) => /* @__PURE__ */ new Date(`${value}T00:00:00Z`);
-/** The locale dates are formatted in: British English ("13 May"), as the replies write dates and as
-*  European visitors read them, never the US order "5/13" that a bare "en" gives. */
-const dateLocale = (locale) => locale === "en" ? "en-GB" : "de-DE";
-/** "12.–19. Juli 2027" from two `YYYY-MM-DD` days. */
-const period = (stay, locale) => new Intl.DateTimeFormat(dateLocale(locale), {
-	day: "numeric",
-	month: "short",
-	year: "numeric",
-	timeZone: "UTC"
-}).formatRange(day(stay.start), day(stay.end));
-/** "14.–21. Juli", "26. Dez.–2. Jan.": the short form, without years even over New Year. */
-const shortPeriod = (stay, locale) => {
-	const short = new Intl.DateTimeFormat(dateLocale(locale), {
-		day: "numeric",
-		month: "short",
-		timeZone: "UTC"
-	});
-	return stay.start.slice(0, 4) === stay.end.slice(0, 4) ? short.formatRange(day(stay.start), day(stay.end)) : `${short.format(day(stay.start))}–${short.format(day(stay.end))}`;
-};
-/** "1 Kind", "2 Kinder": a count in its plural form, its number and noun joined by a no-break space,
-*  so a narrow card never ends a line on the "2". */
-const counted = (forms, n, locale) => (forms[new Intl.PluralRules(locale).select(n)] ?? forms.other).replace("{n} ", `${n}\u00a0`).replace("{n}", String(n));
-/** "2 Schlafzimmer" from the PMS, its number and noun joined by a no-break space as in `counted`. */
-const keepCount = (fact) => fact.replace(/^(\d+) /, "$1\xA0");
-/** A review count as the PMS formats it ("36", or "1 Bewertungen" on v10), as the number it states. */
-const reviewCount = (count) => Number(count.replace(/\D/g, ""));
-const partyText = (stay, copy, locale) => {
-	const children = stay.party.children + stay.party.babies;
-	return [
-		counted(copy.adults, stay.party.adults, locale),
-		...children ? [counted(copy.children, children, locale)] : [],
-		...stay.party.pets ? [counted(copy.pets, stay.party.pets, locale)] : []
-	].join(", ");
-};
-/** A bookable stay goes to the rental's booking page with everything chosen, where the site has one;
-*  otherwise to the rental page (or the search) with the stay filled in. */
-const useBookHref = (rentalId, stay) => {
-	const { searchPath } = useChat();
-	const page = useStateValue(statePath("pages", rentalId)) ?? null;
-	const booking = useStateValue(statePath("bookingPages", rentalId)) ?? null;
-	if (stay?.bookable && booking) return bookingHref(booking, stay);
-	return stayHref(page, stay?.bookable ? stay : null, searchPath);
-};
-/** A link out of the chat. It waits while a reply streams: leaving the page then aborts the turn,
-*  which neither the service nor the widget keeps, and a first conversation would be lost. */
-const ReplyLink = ({ href, className, children }) => {
-	const { busy } = useChat();
-	return busy ? /* @__PURE__ */ jsx("span", {
-		className,
-		"aria-disabled": "true",
-		children
-	}) : /* @__PURE__ */ jsx("a", {
-		className,
-		href,
-		children
-	});
-};
-/** What a booking link is for, for a screen reader: in a links list, eight "Buchen" say nothing. */
-const LinkTarget = ({ rentalId, stay }) => {
-	const { locale } = useChat();
-	const rental = useRental(rentalId);
-	if (!rental) return null;
-	return /* @__PURE__ */ jsx("span", {
-		className: "sr-only",
-		children: `, ${rental.name}${stay?.bookable ? `, ${shortPeriod(stay, locale)}` : ""}`
-	});
-};
-const BookLink = ({ rentalId, stay }) => {
-	const { copy } = useChat();
-	return /* @__PURE__ */ jsxs(ReplyLink, {
-		className: "button",
-		href: useBookHref(rentalId, stay),
-		children: [stay?.bookable ? copy.bookStay : copy.viewRental, /* @__PURE__ */ jsx(LinkTarget, {
-			rentalId,
-			stay
-		})]
-	});
-};
-/** A row that snaps item by item, with arrow buttons and "n / total"; swipe, scroll or keys move it. */
-const Snapper = ({ count, className, label, children }) => {
-	const { copy } = useChat();
-	const row = useRef(null);
-	const [index, setIndex] = useState(0);
-	const range = (element) => Math.max(1, element.scrollWidth - element.clientWidth);
-	const go = (step) => {
-		const element = row.current;
-		if (!element) return;
-		const still = window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
-		const [first, second] = element.children;
-		const card = first && second ? second.offsetLeft - first.offsetLeft : element.clientWidth;
-		element.scrollBy({
-			left: step * card,
-			behavior: still ? "auto" : "smooth"
-		});
-	};
-	return /* @__PURE__ */ jsxs("div", {
-		className: `${className}-wrap`,
-		role: "group",
-		"aria-roledescription": "carousel",
-		"aria-label": label,
-		children: [/* @__PURE__ */ jsx("div", {
-			ref: row,
-			className,
-			onScroll: (event) => {
-				const element = event.currentTarget;
-				setIndex(Math.round(element.scrollLeft / range(element) * (count - 1)));
-			},
-			children
-		}), count > 1 && /* @__PURE__ */ jsxs("div", {
-			className: "snap-nav",
-			children: [
-				/* @__PURE__ */ jsx("button", {
-					type: "button",
-					"aria-label": copy.previous,
-					disabled: index === 0,
-					onClick: () => go(-1),
-					children: /* @__PURE__ */ jsx(Chevron, { side: "prev" })
-				}),
-				/* @__PURE__ */ jsxs("span", {
-					className: "muted",
-					children: [
-						Math.min(index + 1, count),
-						" / ",
-						count
-					]
-				}),
-				/* @__PURE__ */ jsx("button", {
-					type: "button",
-					"aria-label": copy.next,
-					disabled: index >= count - 1,
-					onClick: () => go(1),
-					children: /* @__PURE__ */ jsx(Chevron, { side: "next" })
-				})
-			]
-		})]
-	});
-};
-/** A rental's photos, swiped or stepped through with the arrows a pointer brings up; the dots say
-*  which one shows. */
-const Gallery = ({ images, name }) => {
-	const { copy } = useChat();
-	const row = useRef(null);
-	const [index, setIndex] = useState(0);
-	if (images.length === 0) return null;
-	const go = (to) => {
-		const element = row.current;
-		if (!element) return;
-		const still = window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
-		element.scrollTo({
-			left: to * element.clientWidth,
-			behavior: still ? "auto" : "smooth"
-		});
-	};
-	const many = images.length > 1;
-	return /* @__PURE__ */ jsxs("div", {
-		className: "gallery-wrap",
-		role: "group",
-		"aria-roledescription": "carousel",
-		"aria-label": name,
-		children: [/* @__PURE__ */ jsx("div", {
-			ref: row,
-			className: "gallery",
-			onScroll: (event) => {
-				const element = event.currentTarget;
-				setIndex(Math.round(element.scrollLeft / Math.max(1, element.clientWidth)));
-			},
-			children: images.map((image, imageIndex) => /* @__PURE__ */ jsx("img", {
-				src: image.src,
-				alt: image.alt || `${name}, ${copy.photo} ${imageIndex + 1}`,
-				loading: "lazy"
-			}, image.src))
-		}), many && /* @__PURE__ */ jsxs(Fragment, { children: [
-			/* @__PURE__ */ jsx("button", {
-				type: "button",
-				className: "gallery-arrow",
-				"data-side": "prev",
-				"aria-label": copy.previous,
-				disabled: index === 0,
-				onClick: () => go(index - 1),
-				children: /* @__PURE__ */ jsx(Chevron, { side: "prev" })
-			}),
-			/* @__PURE__ */ jsx("button", {
-				type: "button",
-				className: "gallery-arrow",
-				"data-side": "next",
-				"aria-label": copy.next,
-				disabled: index >= images.length - 1,
-				onClick: () => go(index + 1),
-				children: /* @__PURE__ */ jsx(Chevron, { side: "next" })
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "dots",
-				"aria-hidden": "true",
-				children: images.map((image, imageIndex) => /* @__PURE__ */ jsx("i", { "data-current": imageIndex === index || void 0 }, image.src))
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "sr-only",
-				children: `${copy.photo} ${Math.min(index + 1, images.length)} / ${images.length}`
-			})
-		] })]
-	});
-};
-/** The PMS's score as a chip; its number of reviews is read out, not shown. */
-const Rating = ({ rental }) => {
-	const { copy, locale } = useChat();
-	if (!rental.rating) return null;
-	const { value, count } = rental.rating;
-	return /* @__PURE__ */ jsx("span", {
-		className: "score-chip",
-		role: "img",
-		title: counted(copy.reviews, reviewCount(count), locale),
-		"aria-label": `${value}, ${counted(copy.reviews, reviewCount(count), locale)}`,
-		children: value
-	});
-};
-/** The visitor's wishes the latest search that found the rental applied, which it therefore has. */
-const useWishes = (rentalId) => useStateValue(statePath("wishes", rentalId)) ?? [];
-const Wishes = ({ wishes }) => {
-	const { copy } = useChat();
-	if (wishes.length === 0) return null;
-	return /* @__PURE__ */ jsx("ul", {
-		className: "wishes",
-		"aria-label": copy.matchesWishes,
-		children: wishes.map((wish) => /* @__PURE__ */ jsxs("li", { children: [/* @__PURE__ */ jsx(Check, {}), wish] }, wish))
-	});
-};
-/** "7 Nächte · 6.–13. Mai": a stay's length and dates, short. */
-const stayMeta = (stay, copy, locale) => {
-	const nights = Math.round((day(stay.end).getTime() - day(stay.start).getTime()) / 864e5);
-	return /* @__PURE__ */ jsxs(Fragment, { children: [
-		counted(copy.nights, nights, locale),
-		" ·",
-		" ",
-		/* @__PURE__ */ jsx("span", {
-			className: "period",
-			children: shortPeriod(stay, locale)
-		})
-	] });
-};
-/** A card's foot: the stay's total, its length and dates and the party it is for, and the way to
-*  book or to the rental. */
-const CardFoot = ({ rentalId, stay }) => {
-	const { copy, locale } = useChat();
-	const href = useBookHref(rentalId, stay);
-	return /* @__PURE__ */ jsxs("div", {
-		className: "card-foot",
-		children: [stay && /* @__PURE__ */ jsx("div", {
-			className: "foot-price",
-			children: !stay.bookable ? /* @__PURE__ */ jsx("span", {
-				className: "foot-meta",
-				children: copy.notBookable
-			}) : /* @__PURE__ */ jsxs(Fragment, { children: [
-				stay.total && /* @__PURE__ */ jsx("span", {
-					className: "price",
-					children: stay.total
-				}),
-				/* @__PURE__ */ jsx("span", {
-					className: "foot-meta",
-					children: stayMeta(stay, copy, locale)
-				}),
-				/* @__PURE__ */ jsx("span", {
-					className: "foot-meta",
-					children: partyText(stay, copy, locale)
-				})
-			] })
-		}), /* @__PURE__ */ jsxs(ReplyLink, {
-			className: "button compact",
-			href,
-			children: [stay?.bookable ? copy.book : copy.view, /* @__PURE__ */ jsx(LinkTarget, {
-				rentalId,
-				stay
-			})]
-		})]
-	});
-};
-const Card = ({ rentalId, stayId }) => {
-	const rental = useRental(rentalId);
-	const stay = useStay(stayId, rentalId);
-	const wishes = useWishes(rentalId);
-	if (!rental) return null;
-	return /* @__PURE__ */ jsxs("article", {
-		className: "card rental-card",
-		children: [
-			rental.images.length > 0 ? /* @__PURE__ */ jsx(Gallery, {
-				images: rental.images,
-				name: rental.name
-			}) : /* @__PURE__ */ jsx("div", {
-				className: "no-photo",
-				"aria-hidden": "true",
-				children: /* @__PURE__ */ jsx(House, {})
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "card-body",
-				children: [
-					/* @__PURE__ */ jsxs("div", {
-						className: "card-meta",
-						children: [rental.place && /* @__PURE__ */ jsx("span", {
-							className: "place",
-							children: rental.place
-						}), /* @__PURE__ */ jsx(Rating, { rental })]
-					}),
-					/* @__PURE__ */ jsx("h3", {
-						className: "card-title",
-						children: rental.name
-					}),
-					rental.highlights.length > 0 && /* @__PURE__ */ jsx("p", {
-						className: "specs",
-						children: rental.highlights.slice(0, 3).map(keepCount).join(" · ")
-					}),
-					/* @__PURE__ */ jsx(Wishes, { wishes })
-				]
-			}),
-			/* @__PURE__ */ jsx(CardFoot, {
-				rentalId: rental.id,
-				stay
-			})
-		]
-	});
-};
-/** Monday-first weeks of one month, as `YYYY-MM-DD` days and `null` padding. */
-const monthGrid = (month) => {
-	const first = day(`${month}-01`);
-	const days = new Date(Date.UTC(first.getUTCFullYear(), first.getUTCMonth() + 1, 0)).getUTCDate();
-	const lead = (first.getUTCDay() + 6) % 7;
-	return [...Array.from({ length: lead }, () => null), ...Array.from({ length: days }, (_, i) => `${month}-${String(i + 1).padStart(2, "0")}`)];
-};
-const monthsOf = (calendar) => {
-	const months = [];
-	for (let month = calendar.from.slice(0, 7); month <= calendar.through.slice(0, 7);) {
-		months.push(month);
-		const next = day(`${month}-01`);
-		next.setUTCMonth(next.getUTCMonth() + 1);
-		month = next.toISOString().slice(0, 7);
-	}
-	return months;
-};
-const Calendar = ({ rentalId, stayId }) => {
-	const { copy, locale } = useChat();
-	const rental = useRental(rentalId);
-	const stay = useStay(stayId, rentalId);
-	const calendar = useStateValue(statePath("availability", rentalId)) ?? null;
-	const months = calendar ? monthsOf(calendar) : [];
-	const [shown, setShown] = useState(() => Math.max(0, stay ? months.indexOf(stay.start.slice(0, 7)) : 0));
-	if (!calendar || months.length === 0) return null;
-	const month = months[Math.min(shown, months.length - 1)];
-	const weekdays = Array.from({ length: 7 }, (_, i) => new Intl.DateTimeFormat(dateLocale(locale), {
-		weekday: "short",
-		timeZone: "UTC"
-	}).format(day(`2024-01-0${i + 1}`)));
-	const title = new Intl.DateTimeFormat(dateLocale(locale), {
-		month: "long",
-		year: "numeric",
-		timeZone: "UTC"
-	}).format(day(`${month}-01`));
-	const inStay = (date) => Boolean(stay && date >= stay.start && date <= stay.end);
-	const fullDate = new Intl.DateTimeFormat(dateLocale(locale), {
-		weekday: "long",
-		day: "numeric",
-		month: "long",
-		timeZone: "UTC"
-	});
-	const statusText = {
-		free: copy.free,
-		booked: copy.booked,
-		closed: copy.closed
-	};
-	return /* @__PURE__ */ jsxs("div", {
-		className: "calendar",
-		children: [
-			/* @__PURE__ */ jsxs("div", {
-				className: "calendar-head",
-				children: [
-					/* @__PURE__ */ jsx("button", {
-						type: "button",
-						"aria-label": copy.previous,
-						disabled: shown === 0,
-						onClick: () => setShown(shown - 1),
-						children: /* @__PURE__ */ jsx(Chevron, { side: "prev" })
-					}),
-					/* @__PURE__ */ jsxs("span", { children: [title, rental ? ` · ${rental.name}` : ""] }),
-					/* @__PURE__ */ jsx("button", {
-						type: "button",
-						"aria-label": copy.next,
-						disabled: shown >= months.length - 1,
-						onClick: () => setShown(shown + 1),
-						children: /* @__PURE__ */ jsx(Chevron, { side: "next" })
-					})
-				]
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "calendar-grid",
-				children: [weekdays.map((weekday) => /* @__PURE__ */ jsx("span", {
-					className: "weekday",
-					children: weekday
-				}, weekday)), monthGrid(month).map((date, index) => {
-					if (!date) return /* @__PURE__ */ jsx("span", {}, `pad-${index}`);
-					const status = calendar.days[date] ?? "closed";
-					return /* @__PURE__ */ jsxs("span", {
-						className: "day",
-						"data-status": status,
-						"data-stay": inStay(date) || void 0,
-						children: [/* @__PURE__ */ jsx("span", {
-							"aria-hidden": "true",
-							children: Number(date.slice(8))
-						}), /* @__PURE__ */ jsx("span", {
-							className: "sr-only",
-							children: [
-								fullDate.format(day(date)),
-								statusText[status],
-								...inStay(date) ? [copy.yourStay] : []
-							].join(", ")
-						})]
-					}, date);
-				})]
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "legend muted",
-				children: [
-					/* @__PURE__ */ jsxs("span", { children: [/* @__PURE__ */ jsx("i", { "data-status": "free" }), copy.free] }),
-					/* @__PURE__ */ jsxs("span", { children: [/* @__PURE__ */ jsx("i", { "data-status": "booked" }), copy.booked] }),
-					stay && /* @__PURE__ */ jsxs("span", { children: [/* @__PURE__ */ jsx("i", { "data-stay": "true" }), copy.yourStay] })
-				]
-			})
-		]
-	});
-};
-const CompareColumn = ({ rentalId, stayId }) => {
-	const { copy, locale } = useChat();
-	const rental = useRental(rentalId);
-	const stay = useStay(stayId, rentalId);
-	const href = useBookHref(rentalId, stay);
-	if (!rental) return null;
-	const rooms = rental.rooms.slice(0, 3);
-	const highlights = rental.highlights.filter((highlight) => !rooms.includes(highlight));
-	return /* @__PURE__ */ jsxs("div", {
-		className: "compare-col",
-		children: [
-			/* @__PURE__ */ jsx("strong", { children: rental.name }),
-			/* @__PURE__ */ jsxs("dl", { children: [
-				/* @__PURE__ */ jsx("dt", { children: copy.compareRating }),
-				/* @__PURE__ */ jsx("dd", { children: rental.rating ? `★ ${rental.rating.value} (${counted(copy.reviews, reviewCount(rental.rating.count), locale)})` : "–" }),
-				/* @__PURE__ */ jsx("dt", { children: copy.compareRooms }),
-				/* @__PURE__ */ jsx("dd", { children: rooms.map(keepCount).join(", ") || "–" }),
-				/* @__PURE__ */ jsx("dt", { children: copy.compareHighlights }),
-				/* @__PURE__ */ jsx("dd", { children: highlights.slice(0, 4).map(keepCount).join(", ") || "–" }),
-				stay && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("dt", { children: copy.compareStay }), /* @__PURE__ */ jsxs("dd", { children: [
-					shortPeriod(stay, locale),
-					/* @__PURE__ */ jsx("br", {}),
-					/* @__PURE__ */ jsx("span", {
-						className: "muted",
-						children: partyText(stay, copy, locale)
-					}),
-					/* @__PURE__ */ jsx("br", {}),
-					!stay.bookable ? /* @__PURE__ */ jsx("span", {
-						className: "muted",
-						children: copy.notBookable
-					}) : stay.total && /* @__PURE__ */ jsx("span", {
-						className: "price",
-						children: stay.total
-					})
-				] })] })
-			] }),
-			/* @__PURE__ */ jsxs(ReplyLink, {
-				className: "button",
-				href,
-				children: [stay?.bookable ? copy.book : copy.view, /* @__PURE__ */ jsx(LinkTarget, {
-					rentalId,
-					stay
-				})]
-			})
-		]
-	});
-};
-const AlternativeChip = ({ stay }) => {
-	const { locale } = useChat();
-	const href = useBookHref(stay.rentalId, stay);
-	return /* @__PURE__ */ jsx(ReplyLink, {
-		className: "chip-link",
-		href,
-		children: /* @__PURE__ */ jsxs("span", { children: [/* @__PURE__ */ jsx("strong", { children: shortPeriod(stay, locale) }), stay.total ? ` · ${stay.total}` : ""] })
-	});
-};
-/** One arrival of a price calendar: its bar, the PMS's total, the day; tapping asks for that stay. */
-const PriceColumn = ({ rentalId, option, asked, cheapest }) => {
-	const { copy, locale, send, busy } = useChat();
-	const rental = useRental(rentalId);
-	const stay = useStay(option.stayId, rentalId);
-	const free = Boolean(stay?.bookable && stay.total);
-	const arrival = (options) => new Intl.DateTimeFormat(dateLocale(locale), {
-		...options,
-		timeZone: "UTC"
-	}).format(day(option.start));
-	const dates = period(option, locale);
-	return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("button", {
-		type: "button",
-		className: "price-column",
-		"data-asked": asked || void 0,
-		"data-cheapest": cheapest || void 0,
-		"data-free": free || void 0,
-		disabled: !free || !send || busy,
-		"aria-label": [
-			dates,
-			free ? stay.total : copy.closed,
-			...cheapest ? [copy.cheapest] : [],
-			...asked ? [copy.yourStay] : []
-		].join(", "),
-		onClick: () => send?.(rental ? `${rental.name}: ${dates}` : dates),
-		children: [
-			/* @__PURE__ */ jsx("span", {
-				className: "bar-track",
-				"aria-hidden": "true",
-				children: free && /* @__PURE__ */ jsx("span", {
-					className: "bar",
-					style: { height: `${25 + 75 * (option.level ?? 1)}%` }
-				})
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "price-text",
-				"aria-hidden": "true",
-				children: free ? stay.total : copy.closed
-			}),
-			/* @__PURE__ */ jsxs("span", {
-				className: "muted",
-				"aria-hidden": "true",
-				children: [
-					arrival({ weekday: "short" }),
-					/* @__PURE__ */ jsx("br", {}),
-					arrival({
-						day: "numeric",
-						month: "short"
-					})
-				]
-			})
-		]
-	}) });
-};
-/** Which ends of a scrolled row have more beyond them, for the fade there. */
-const hiddenEdges = (row) => {
-	const start = row.scrollLeft > 1;
-	const end = row.scrollLeft + row.clientWidth < row.scrollWidth - 1;
-	return start && end ? "both" : start ? "start" : end ? "end" : void 0;
-};
-const PriceCalendarView = ({ rentalId }) => {
-	const { copy, locale } = useChat();
-	const rental = useRental(rentalId);
-	const calendar = useStateValue(statePath("priceCalendars", rentalId)) ?? null;
-	const row = useRef(null);
-	const [fade, setFade] = useState();
-	useEffect(() => {
-		const element = row.current;
-		if (!element || !calendar) return;
-		const cheapest = calendar.options.findIndex((option) => option.stayId !== null && option.stayId === calendar.cheapest);
-		const asked = calendar.options.findIndex((option) => option.start === calendar.asked);
-		const column = element.children[cheapest >= 0 ? cheapest : asked];
-		if (column) {
-			const end = column.offsetLeft + column.offsetWidth;
-			if (end > element.clientWidth) element.scrollLeft = end - element.clientWidth;
-		}
-		setFade(hiddenEdges(element));
-	}, [calendar]);
-	if (!calendar || calendar.options.length === 0) return null;
-	return /* @__PURE__ */ jsx("section", {
-		className: "card price-calendar",
-		"aria-label": copy.priceCalendar,
-		children: /* @__PURE__ */ jsxs("div", {
-			className: "card-body",
-			children: [
-				/* @__PURE__ */ jsx("h3", {
-					className: "card-title",
-					children: copy.priceCalendar
-				}),
-				/* @__PURE__ */ jsxs("span", {
-					className: "muted",
-					children: [counted(copy.priceCalendarNights, calendar.nights, locale), rental ? ` · ${rental.name}` : ""]
-				}),
-				/* @__PURE__ */ jsx("ul", {
-					ref: row,
-					className: "price-columns",
-					"data-fade": fade,
-					onScroll: (event) => setFade(hiddenEdges(event.currentTarget)),
-					children: calendar.options.map((option) => /* @__PURE__ */ jsx(PriceColumn, {
-						rentalId,
-						option,
-						asked: option.start === calendar.asked,
-						cheapest: option.stayId !== null && option.stayId === calendar.cheapest
-					}, option.start))
-				}),
-				/* @__PURE__ */ jsxs("div", {
-					className: "legend muted",
-					children: [/* @__PURE__ */ jsxs("span", { children: [/* @__PURE__ */ jsx("i", { "data-cheapest": "true" }), copy.cheapest] }), /* @__PURE__ */ jsxs("span", { children: [/* @__PURE__ */ jsx("i", { "data-asked": "true" }), copy.yourStay] })]
-				})
-			]
-		})
-	});
-};
-const ReviewsView = ({ rentalId }) => {
-	const { copy, locale } = useChat();
-	const rental = useRental(rentalId);
-	const reviews = useStateValue(statePath("reviews", rentalId)) ?? null;
-	if (!reviews) return null;
-	return /* @__PURE__ */ jsx("section", {
-		className: "card reviews",
-		"aria-label": copy.reviewsTitle,
-		children: /* @__PURE__ */ jsxs("div", {
-			className: "card-body",
-			children: [
-				/* @__PURE__ */ jsxs("h3", {
-					className: "card-title",
-					children: [copy.reviewsTitle, rental ? ` · ${rental.name}` : ""]
-				}),
-				/* @__PURE__ */ jsxs("div", {
-					className: "score",
-					children: [/* @__PURE__ */ jsx("span", {
-						className: "score-value",
-						children: reviews.rating
-					}), /* @__PURE__ */ jsxs("span", { children: [reviews.grade && /* @__PURE__ */ jsx("strong", { children: reviews.grade }), /* @__PURE__ */ jsxs("span", {
-						className: "muted",
-						children: [" ", counted(copy.reviews, reviewCount(reviews.count), locale)]
-					})] })]
-				}),
-				reviews.categories.length > 0 && /* @__PURE__ */ jsx("dl", {
-					className: "review-categories",
-					children: reviews.categories.map((category) => /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", { children: category.label }), /* @__PURE__ */ jsx("dd", { children: category.rating })] }, category.label))
-				}),
-				reviews.excerpts.map((excerpt) => /* @__PURE__ */ jsx("blockquote", {
-					className: "excerpt",
-					children: /* @__PURE__ */ jsx("p", { children: excerpt.text })
-				}, excerpt.text))
-			]
-		})
-	});
-};
-const FactsView = ({ rentalId, groups }) => {
-	const rental = useRental(rentalId);
-	const known = useStateValue(statePath("facts", rentalId)) ?? [];
-	const shown = groups.flatMap((label) => {
-		const group = known.find((candidate) => candidate.label.toLowerCase() === label.toLowerCase());
-		return group ? [group] : [];
-	});
-	if (!rental || shown.length === 0) return null;
-	return /* @__PURE__ */ jsx("section", {
-		className: "card facts",
-		"aria-label": rental.name,
-		children: /* @__PURE__ */ jsxs("div", {
-			className: "card-body",
-			children: [/* @__PURE__ */ jsx("h3", {
-				className: "card-title",
-				children: rental.name
-			}), shown.map((group) => /* @__PURE__ */ jsxs("div", {
-				className: "fact-group",
-				children: [/* @__PURE__ */ jsx("h4", { children: group.label }), /* @__PURE__ */ jsx("ul", { children: group.items.map((item) => /* @__PURE__ */ jsx("li", { children: item }, item)) })]
-			}, group.label))]
-		})
-	});
-};
-const RentalMapView = ({ rentalId }) => {
-	const { copy } = useChat();
-	const rental = useRental(rentalId);
-	const href = useBookHref(rentalId, null);
-	if (!rental) return null;
-	return /* @__PURE__ */ jsx(MapCard, {
-		rental,
-		label: copy.mapLabel.replace("{name}", rental.name),
-		notice: copy.mapNotice,
-		load: copy.mapLoad,
-		children: /* @__PURE__ */ jsxs("div", {
-			className: "card-body",
-			children: [
-				/* @__PURE__ */ jsx("h3", {
-					className: "card-title",
-					children: rental.name
-				}),
-				rental.place && /* @__PURE__ */ jsx("span", {
-					className: "muted",
-					children: rental.place
-				}),
-				/* @__PURE__ */ jsx(ReplyLink, {
-					className: "button",
-					href,
-					children: copy.viewRental
-				})
-			]
-		})
-	});
-};
-/** The registry the panel renders specs with. */
-const { registry } = defineRegistry(chatCatalog, { components: {
-	Stack: ({ children }) => /* @__PURE__ */ jsx("div", {
-		className: "ui",
-		children
-	}),
-	RentalCard: ({ props }) => /* @__PURE__ */ jsx(Card, {
-		rentalId: props.rentalId,
-		stayId: props.stayId
-	}),
-	RentalCarousel: ({ props }) => {
-		const { copy } = useChat();
-		return /* @__PURE__ */ jsx(Snapper, {
-			count: props.items.length,
-			className: "carousel",
-			label: copy.rentalsFound,
-			children: props.items.map((item) => /* @__PURE__ */ jsx(Card, {
-				rentalId: item.rentalId,
-				stayId: item.stayId
-			}, `${item.rentalId}:${item.stayId}`))
-		});
-	},
-	StayQuote: ({ props }) => {
-		const stay = useStay(props.stayId);
-		const rental = useRental(stay?.rentalId ?? "");
-		if (!stay) return null;
-		return /* @__PURE__ */ jsxs("article", {
-			className: "card stay-card",
-			children: [/* @__PURE__ */ jsx("div", {
-				className: "card-body",
-				children: rental && /* @__PURE__ */ jsx("h3", {
-					className: "card-title",
-					children: rental.name
-				})
-			}), /* @__PURE__ */ jsx(CardFoot, {
-				rentalId: stay.rentalId,
-				stay
-			})]
-		});
-	},
-	PriceBreakdown: ({ props }) => {
-		const { copy, locale } = useChat();
-		const stay = useStay(props.stayId);
-		const rental = useRental(stay?.rentalId ?? "");
-		if (!stay?.bookable || !stay.total) return null;
-		const label = rental ? `${copy.priceBreakdown} · ${rental.name}` : copy.priceBreakdown;
-		return /* @__PURE__ */ jsx("section", {
-			className: "card breakdown",
-			"aria-label": label,
-			children: /* @__PURE__ */ jsxs("div", {
-				className: "card-body",
-				children: [
-					/* @__PURE__ */ jsx("span", {
-						className: "muted",
-						children: label
-					}),
-					/* @__PURE__ */ jsxs("span", {
-						className: "foot-meta",
-						children: [
-							stayMeta(stay, copy, locale),
-							" · ",
-							partyText(stay, copy, locale)
-						]
-					}),
-					stay.lines.map((line) => /* @__PURE__ */ jsxs("div", {
-						className: "line",
-						children: [/* @__PURE__ */ jsx("span", { children: line.label }), /* @__PURE__ */ jsx("span", { children: line.amount })]
-					}, `${line.label}:${line.amount}`)),
-					/* @__PURE__ */ jsxs("div", {
-						className: "line total",
-						children: [/* @__PURE__ */ jsx("span", { children: copy.total }), /* @__PURE__ */ jsx("span", { children: stay.total })]
-					})
-				]
-			})
-		});
-	},
-	AlternativeStays: ({ props }) => {
-		const { copy } = useChat();
-		const rental = useRental(props.rentalId);
-		const stays = useStateValue("/stays") ?? {};
-		const bookable = props.stayIds.flatMap((stayId) => {
-			const stay = stays[stayId];
-			return stay?.rentalId === props.rentalId && stay.bookable ? [stay] : [];
-		});
-		if (bookable.length === 0) return null;
-		const label = rental ? `${copy.otherDates} · ${rental.name}` : copy.otherDates;
-		return /* @__PURE__ */ jsxs("div", {
-			className: "alternatives",
-			role: "group",
-			"aria-label": label,
-			children: [/* @__PURE__ */ jsx("p", {
-				className: "alt-caption",
-				"aria-hidden": "true",
-				children: label
-			}), /* @__PURE__ */ jsx("div", {
-				className: "alt-chips",
-				children: bookable.map((stay) => /* @__PURE__ */ jsx(AlternativeChip, { stay }, stay.id))
-			})]
-		});
-	},
-	AvailabilityCalendar: ({ props }) => /* @__PURE__ */ jsx(Calendar, {
-		rentalId: props.rentalId,
-		stayId: props.stayId
-	}),
-	PriceCalendar: ({ props }) => /* @__PURE__ */ jsx(PriceCalendarView, { rentalId: props.rentalId }),
-	ReviewSummary: ({ props }) => /* @__PURE__ */ jsx(ReviewsView, { rentalId: props.rentalId }),
-	RentalFacts: ({ props }) => /* @__PURE__ */ jsx(FactsView, {
-		rentalId: props.rentalId,
-		groups: props.groups
-	}),
-	RentalMap: ({ props }) => /* @__PURE__ */ jsx(RentalMapView, { rentalId: props.rentalId }),
-	Compare: ({ props }) => /* @__PURE__ */ jsx("div", {
-		className: "compare",
-		children: props.items.map((item) => /* @__PURE__ */ jsx(CompareColumn, {
-			rentalId: item.rentalId,
-			stayId: item.stayId
-		}, `${item.rentalId}:${item.stayId}`))
-	}),
-	StayLink: ({ props }) => {
-		const stay = useStay(props.stayId, props.rentalId);
-		return /* @__PURE__ */ jsx(BookLink, {
-			rentalId: props.rentalId,
-			stay
-		});
-	},
-	ContactLink: () => {
-		const { copy, contactPath } = useChat();
-		return /* @__PURE__ */ jsx(ReplyLink, {
-			className: "link",
-			href: contactPath,
-			children: copy.contactLink
-		});
-	},
-	QuickReplies: ({ props }) => {
-		const { send, busy } = useChat();
-		if (!send) return null;
-		return /* @__PURE__ */ jsx("div", {
-			className: "quick-replies",
-			children: props.options.map((option) => /* @__PURE__ */ jsx("button", {
-				type: "button",
-				className: "chip",
-				disabled: busy,
-				onClick: () => send(option),
-				children: option
-			}, option))
-		});
-	}
-} });
-//#endregion
-//#region src/panel.tsx
-/** Appends one event's content to the reply being streamed (the last message). */
-const appendToReply = (messages, part) => {
-	const last = messages.at(-1);
-	if (!last || last.role !== "assistant") return [...messages, {
-		role: "assistant",
-		parts: [part],
-		unconfirmed: true
-	}];
-	const tail = last.parts.at(-1);
-	const parts = part.kind === "text" && tail?.kind === "text" ? [...last.parts.slice(0, -1), {
-		kind: "text",
-		text: tail.text + part.text
-	}] : [...last.parts, part];
-	return [...messages.slice(0, -1), {
-		...last,
-		parts
-	}];
-};
-/** The service finished the turn: its messages, from its visitor message on, are the
-*  conversation's now. An earlier turn it refused stays unconfirmed, on this page only. */
-const confirmed = (messages) => {
-	const turn = messages.findLastIndex((message) => message.role === "visitor");
-	return messages.map((message, index) => index >= turn && message.unconfirmed ? {
-		role: message.role,
-		parts: message.parts
-	} : message);
-};
-const SCROLL_LOCK = "data-v-office-chat-open";
-/** Locks the page's scroll until the returned function runs. The rule lives in the page's head (a
-*  shadow root's styles cannot reach <html>) and is added once. */
-const lockPageScroll = () => {
-	const root = document.documentElement;
-	if (!document.getElementById(SCROLL_LOCK)) {
-		const style = document.createElement("style");
-		style.id = SCROLL_LOCK;
-		style.textContent = `html[${SCROLL_LOCK}] { overflow: hidden; }`;
-		document.head.append(style);
-	}
-	root.setAttribute(SCROLL_LOCK, "");
-	return () => root.removeAttribute(SCROLL_LOCK);
-};
-/** The assistant's text, its `**bold**` (a rental's name, the dates) as strong text: nothing else
-*  is read as markup, so the model's text never becomes HTML. */
-const RichText = ({ text }) => /* @__PURE__ */ jsx(Fragment, { children: text.split(/\*\*(.+?)\*\*/g).map((piece, index) => index % 2 === 1 ? /* @__PURE__ */ jsx("strong", { children: piece }, index) : piece) });
-const SpecView = ({ spec }) => /* @__PURE__ */ jsx(JSONUIProvider, {
-	registry,
-	initialState: spec.state ?? {},
-	children: /* @__PURE__ */ jsx(Renderer, {
-		spec,
-		registry
-	})
-});
-const Consent = ({ copy, pending, onAccept, buttonRef }) => /* @__PURE__ */ jsxs("div", {
-	className: "consent",
-	children: [
-		/* @__PURE__ */ jsx("p", {
-			className: "message",
-			"data-role": "assistant",
-			children: copy.greeting
-		}),
-		pending && /* @__PURE__ */ jsxs("figure", {
-			className: "pending",
-			children: [/* @__PURE__ */ jsx("figcaption", {
-				className: "muted",
-				children: copy.yourMessage
-			}), /* @__PURE__ */ jsx("p", { children: pending })]
-		}),
-		/* @__PURE__ */ jsxs("div", {
-			className: "consent-card",
-			children: [/* @__PURE__ */ jsx("p", { children: copy.consent }), /* @__PURE__ */ jsx("button", {
-				ref: buttonRef,
-				type: "button",
-				className: "button compact",
-				onClick: onAccept,
-				children: copy.consentAccept
-			})]
-		})
-	]
-});
-/** Shown until the reply's text: a search takes seconds, and three dots alone read as nothing.
-*  Hidden from a screen reader: inside the busy log it may go unannounced, so the panel's own status,
-*  outside the log, says it. */
-const Thinking = ({ label }) => /* @__PURE__ */ jsxs("div", {
-	className: "thinking",
-	"aria-hidden": "true",
-	children: [
-		/* @__PURE__ */ jsx("i", {}),
-		/* @__PURE__ */ jsx("i", {}),
-		/* @__PURE__ */ jsx("i", {}),
-		/* @__PURE__ */ jsx("span", {
-			className: "thinking-label",
-			children: label
-		})
-	]
-});
-/** Why the chat cannot answer, as its reply to the visitor's message, and where to go instead. */
-const Fallback = ({ reason, copy, searchPath, contactPath }) => /* @__PURE__ */ jsxs("div", {
-	className: "fallback",
-	role: "status",
-	children: [/* @__PURE__ */ jsx("p", {
-		className: "message",
-		"data-role": "assistant",
-		children: reason === "busy" ? copy.busy : copy.unavailable
-	}), /* @__PURE__ */ jsxs("div", {
-		className: "fallback-links",
-		children: [/* @__PURE__ */ jsx("a", {
-			className: "button",
-			href: searchPath,
-			children: copy.searchLink
-		}), /* @__PURE__ */ jsx("a", {
-			className: "link",
-			href: contactPath,
-			children: copy.contactLink
-		})]
-	})]
-});
-/** A refusal that a second try can get past: the message goes back into the field to send again. */
-const RETRYABLE = /* @__PURE__ */ new Set(["busy", "error"]);
-function Panel(props) {
-	const { copy, endpoint, open, pending, onSent, onStarted, onClose } = props;
-	const stored = useMemo(() => loadConversation(endpoint), [endpoint]);
-	const [accepted, setAccepted] = useState(stored !== null);
-	const [messages, setMessages] = useState(stored?.messages ?? []);
-	const [draft, setDraft] = useState("");
-	const [streaming, setStreaming] = useState(false);
-	const [unavailable, setUnavailable] = useState(null);
-	const session = useRef(stored?.sessionId ?? null);
-	const abort = useRef(null);
-	const list = useRef(null);
-	const following = useRef(true);
-	const lastRole = useRef(stored?.messages.at(-1)?.role);
-	const start = useRef(null);
-	const composer = useRef(null);
-	const panel = useRef(null);
-	const lastActivity = useRef(stored?.savedAt ?? Date.now());
-	const hasMessages = messages.length > 0;
-	const last = messages.at(-1);
-	const waiting = streaming && !unavailable && (last?.role === "visitor" || !last?.parts.some((part) => part.kind === "text"));
-	const expired = () => Date.now() - lastActivity.current >= SESSION_TTL_S * 1e3;
-	useEffect(() => () => abort.current?.abort(), []);
-	useEffect(() => {
-		const role = messages.at(-1)?.role;
-		const replyStarts = role === "assistant" && lastRole.current === "visitor";
-		lastRole.current = role;
-		const element = list.current;
-		if (!open || !element) return;
-		const turnTop = ([...element.querySelectorAll(":scope > .turn")].at(-1)?.offsetTop ?? 0) - 12;
-		if (replyStarts) element.scrollTop = turnTop;
-		else if (role === "assistant" && following.current) element.scrollTop = Math.max(element.scrollTop, Math.min(element.scrollHeight - element.clientHeight, turnTop));
-		else if (role === "visitor" || following.current) element.scrollTop = element.scrollHeight;
-	}, [
-		messages,
-		open,
-		waiting,
-		unavailable
-	]);
-	useEffect(() => {
-		if (!open) return;
-		const touch = window.matchMedia?.("(pointer: coarse)").matches;
-		if (accepted && hasMessages && touch) panel.current?.focus();
-		else (accepted ? composer : start).current?.focus();
-	}, [accepted, open]);
-	useEffect(() => {
-		onStarted(hasMessages);
-		if (messages.at(-1)?.unconfirmed) return;
-		const kept = messages.filter((message) => !message.unconfirmed);
-		if (kept.length > 0) saveConversation(endpoint, {
-			sessionId: session.current,
-			messages: kept
-		}, lastActivity.current);
-	}, [
-		endpoint,
-		hasMessages,
-		messages,
-		onStarted
-	]);
-	/** Sends one visitor message, typed or tapped (QuickReplies); nothing while a reply streams. */
-	const submit = async (text) => {
-		const message = text.trim().slice(0, MAX_MESSAGE_CHARS);
-		if (!message || streaming) return;
-		const fresh = expired();
-		if (fresh) {
-			session.current = null;
-			clearConversation(endpoint);
-		}
-		setDraft("");
-		const restoreDraft = () => setDraft((current) => current || message);
-		setUnavailable(null);
-		setStreaming(true);
-		setMessages((current) => {
-			const before = fresh ? [] : current;
-			const last = before.at(-1);
-			return [...last?.role === "visitor" && last.unconfirmed && last.parts[0]?.kind === "text" && last.parts[0].text === message ? before.slice(0, -1) : before, {
-				role: "visitor",
-				parts: [{
-					kind: "text",
-					text: message
-				}],
-				unconfirmed: true
-			}];
-		});
-		const sentAt = Date.now();
-		const controller = new AbortController();
-		abort.current = controller;
-		try {
-			await sendMessage(endpoint, {
-				sessionId: session.current,
-				message,
-				locale: props.locale,
-				clientVersion: props.clientVersion
-			}, (chatEvent) => {
-				if (controller.signal.aborted) return;
-				if (chatEvent.type === "session") session.current = chatEvent.sessionId;
-				else if (chatEvent.type === "text") setMessages((current) => appendToReply(current, {
-					kind: "text",
-					text: chatEvent.delta
-				}));
-				else if (chatEvent.type === "ui") setMessages((current) => appendToReply(current, {
-					kind: "ui",
-					spec: chatEvent.spec
-				}));
-				else if (chatEvent.type === "unavailable") {
-					setUnavailable(chatEvent.reason);
-					if (RETRYABLE.has(chatEvent.reason)) restoreDraft();
-				} else if (chatEvent.type === "done") {
-					lastActivity.current = sentAt;
-					setMessages(confirmed);
-				}
-			}, controller.signal);
-		} catch {
-			if (!controller.signal.aborted) {
-				setUnavailable("error");
-				restoreDraft();
-			}
-		} finally {
-			if (abort.current === controller) setStreaming(false);
-		}
-	};
-	useEffect(() => {
-		if (!open || !accepted || pending === null) return;
-		onSent();
-		submit(pending);
-	}, [
-		open,
-		accepted,
-		pending,
-		onSent
-	]);
-	/** A new conversation: the service starts a new session at the next message. */
-	const restart = () => {
-		abort.current?.abort();
-		abort.current = null;
-		setStreaming(false);
-		setMessages([]);
-		setUnavailable(null);
-		session.current = null;
-		clearConversation(endpoint);
-		composer.current?.focus();
-	};
-	useEffect(() => {
-		if (!open) return;
-		return lockPageScroll();
-	}, [open]);
-	useEffect(() => {
-		if (!open) return;
-		document.addEventListener("astro:before-swap", onClose);
-		return () => document.removeEventListener("astro:before-swap", onClose);
-	}, [open, onClose]);
-	useEffect(() => {
-		if (open && hasMessages && !streaming && expired()) restart();
-	}, [open]);
-	/** Tab stays in the panel while it is open: the page behind the scrim is out of reach. */
-	const trapTab = (event) => {
-		const element = panel.current;
-		if (event.key !== "Tab" || !element) return;
-		const focusable = [...element.querySelectorAll("a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled])")];
-		const active = element.getRootNode().activeElement;
-		const edge = event.shiftKey ? focusable[0] : focusable.at(-1);
-		const outside = !element.contains(active) || event.shiftKey && active === element;
-		if (focusable.length === 0 || active === edge || outside) {
-			event.preventDefault();
-			(event.shiftKey ? focusable.at(-1) : focusable[0])?.focus();
-		}
-	};
-	const send = (event) => {
-		event.preventDefault();
-		submit(draft);
-	};
-	return /* @__PURE__ */ jsxs(ChatContext.Provider, {
-		value: {
-			...props,
-			send: (text) => void submit(text),
-			busy: streaming
-		},
-		children: [/* @__PURE__ */ jsx("div", {
-			className: "scrim",
-			hidden: !open,
-			"aria-hidden": "true",
-			onClick: onClose
-		}), /* @__PURE__ */ jsxs("section", {
-			className: "panel",
-			role: "dialog",
-			"aria-modal": "true",
-			"aria-label": copy.title,
-			ref: panel,
-			tabIndex: -1,
-			hidden: !open,
-			inert: !open,
-			onKeyDown: (event) => {
-				if (event.key === "Escape") onClose();
-				trapTab(event);
-			},
-			children: [
-				/* @__PURE__ */ jsxs("header", {
-					className: "header",
-					children: [
-						/* @__PURE__ */ jsx("h2", {
-							className: "title",
-							children: copy.title
-						}),
-						hasMessages && /* @__PURE__ */ jsx("button", {
-							type: "button",
-							className: "icon-button restart",
-							"aria-label": copy.newConversation,
-							title: copy.newConversation,
-							onClick: restart,
-							children: /* @__PURE__ */ jsx(Restart, {})
-						}),
-						/* @__PURE__ */ jsx("button", {
-							type: "button",
-							className: "icon-button close",
-							"aria-label": copy.close,
-							onClick: onClose,
-							children: /* @__PURE__ */ jsx(Cross, {})
-						})
-					]
-				}),
-				/* @__PURE__ */ jsx("p", {
-					className: "notice",
-					children: copy.notice
-				}),
-				accepted ? /* @__PURE__ */ jsxs(Fragment, { children: [
-					/* @__PURE__ */ jsxs("div", {
-						className: "messages",
-						role: "log",
-						"aria-busy": streaming,
-						ref: list,
-						onScroll: (event) => {
-							const element = event.currentTarget;
-							following.current = element.scrollHeight - element.scrollTop - element.clientHeight < 80;
-						},
-						children: [
-							/* @__PURE__ */ jsx("div", {
-								className: "message",
-								"data-role": "assistant",
-								children: copy.greeting
-							}),
-							messages.map((message, index) => /* @__PURE__ */ jsxs("div", {
-								className: message.role === "assistant" ? "ui" : "turn",
-								children: [/* @__PURE__ */ jsxs("span", {
-									className: "sr-only",
-									children: [message.role === "assistant" ? copy.title : copy.yourMessage, ":"]
-								}), message.parts.map((part, partIndex) => part.kind === "text" ? /* @__PURE__ */ jsx("div", {
-									className: "message",
-									"data-role": message.role,
-									children: message.role === "assistant" ? /* @__PURE__ */ jsx(RichText, { text: part.text }) : part.text
-								}, partIndex) : /* @__PURE__ */ jsx(SpecView, { spec: part.spec }, partIndex))]
-							}, index)),
-							unavailable && /* @__PURE__ */ jsx(Fallback, {
-								reason: unavailable,
-								copy,
-								searchPath: props.searchPath,
-								contactPath: props.contactPath
-							}),
-							waiting && /* @__PURE__ */ jsx(Thinking, { label: copy.thinking })
-						]
-					}),
-					/* @__PURE__ */ jsx("p", {
-						className: "sr-only",
-						role: "status",
-						children: waiting ? copy.thinking : ""
-					}),
-					/* @__PURE__ */ jsxs("div", {
-						className: "dock",
-						children: [!hasMessages && copy.suggestions.length > 0 && /* @__PURE__ */ jsx("div", {
-							className: "suggestions",
-							children: copy.suggestions.map((suggestion) => /* @__PURE__ */ jsxs("button", {
-								type: "button",
-								className: "suggestion",
-								onClick: () => void submit(suggestion),
-								children: [/* @__PURE__ */ jsx(TopicIcon, { text: suggestion }), suggestion]
-							}, suggestion))
-						}), /* @__PURE__ */ jsxs("form", {
-							className: "composer",
-							onSubmit: send,
-							children: [/* @__PURE__ */ jsx("textarea", {
-								ref: composer,
-								rows: 1,
-								value: draft,
-								maxLength: MAX_MESSAGE_CHARS,
-								placeholder: copy.placeholder,
-								"aria-label": copy.placeholder,
-								onChange: (event) => setDraft(event.target.value),
-								onKeyDown: (event) => {
-									if (event.key !== "Enter" || event.shiftKey || event.nativeEvent.isComposing) return;
-									event.preventDefault();
-									event.currentTarget.form?.requestSubmit();
-								}
-							}), /* @__PURE__ */ jsx("button", {
-								type: "submit",
-								className: "send",
-								"aria-label": copy.send,
-								disabled: streaming || !draft.trim(),
-								children: /* @__PURE__ */ jsx(Arrow, {})
-							})]
-						})]
-					})
-				] }) : /* @__PURE__ */ jsx(Consent, {
-					copy,
-					pending,
-					onAccept: () => setAccepted(true),
-					buttonRef: start
-				})
-			]
-		})]
-	});
-}
-//#endregion
-export { Panel as default };