@questpackages/tours 0.1.0-test.0

package/dist/react/party-size.js

@@ -0,0 +1,81 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { createContext, useContext, useMemo, useState } from "react";
+import { adultCountOptions, childrenCountOptions, findPartyPriceOption, } from "./party-size-rules.js";
+import { Icon } from "./shared.js";
+const TourPartySizeContext = createContext(null);
+function initialAdults(tour) {
+    const bounds = tour.enquiry;
+    const options = adultCountOptions(bounds, tour.enquiry.childrenAllowed);
+    const baseline = tour.pricing.partySize?.baselineAdults ?? bounds.minTravellers;
+    return options.includes(baseline) ? baseline : (options[0] ?? bounds.minTravellers);
+}
+/** Shares the chosen group size between the price panel and the booking and inquiry forms. */
+export function TourPartySizeProvider({ tour, children: content }) {
+    const [adults, setAdultsState] = useState(() => initialAdults(tour));
+    const [children, setChildren] = useState(0);
+    const value = useMemo(() => {
+        const setAdults = (next) => {
+            setAdultsState(next);
+            const allowed = childrenCountOptions(next, tour.enquiry);
+            setChildren((current) => (allowed.includes(current) ? current : (allowed[0] ?? 0)));
+        };
+        return {
+            adults,
+            children,
+            setAdults,
+            setChildren,
+            selected: findPartyPriceOption(tour, adults, children),
+        };
+    }, [adults, children, tour]);
+    return _jsx(TourPartySizeContext.Provider, { value: value, children: content });
+}
+export function useOptionalTourPartySize() {
+    return useContext(TourPartySizeContext);
+}
+export function useTourPartySize() {
+    const context = useOptionalTourPartySize();
+    if (!context) {
+        throw new Error("useTourPartySize must be used inside <TourDetail> or <TourPartySizeProvider>.");
+    }
+    return context;
+}
+/** Adults and (when allowed) children selects bound to the shared group size. */
+export function TourPartySizeFields({ tour, idPrefix }) {
+    const { adults, children, setAdults, setChildren } = useTourPartySize();
+    const adultOptions = adultCountOptions(tour.enquiry, tour.enquiry.childrenAllowed);
+    return (_jsxs("div", { className: "qt-field-row", children: [_jsxs("label", { className: "qt-field", htmlFor: `${idPrefix}-adults`, children: [_jsxs("span", { className: "qt-field-label", children: [_jsx(Icon.Users, {}), " Adults"] }), _jsx("select", { id: `${idPrefix}-adults`, className: "qt-input", value: adults, onChange: (event) => setAdults(Number(event.target.value)), children: adultOptions.map((count) => (_jsx("option", { value: count, children: count }, count))) })] }), tour.enquiry.childrenAllowed ? (_jsxs("label", { className: "qt-field", htmlFor: `${idPrefix}-children`, children: [_jsx("span", { className: "qt-field-label", children: "Children" }), _jsx("select", { id: `${idPrefix}-children`, className: "qt-input", value: children, onChange: (event) => setChildren(Number(event.target.value)), children: childrenCountOptions(adults, tour.enquiry).map((count) => (_jsx("option", { value: count, children: count }, count))) })] })) : null] }));
+}
+const availabilityDate = new Intl.DateTimeFormat("en", { dateStyle: "medium", timeZone: "UTC" });
+function formatAvailabilityDate(value) {
+    if (!value)
+        return null;
+    const date = new Date(`${value.slice(0, 10)}T00:00:00Z`);
+    return Number.isNaN(date.getTime()) ? value : availabilityDate.format(date);
+}
+function availabilityNote(tour) {
+    const startDate = formatAvailabilityDate(tour.availability.startDate);
+    const endDate = formatAvailabilityDate(tour.availability.endDate);
+    if (tour.availability.unlimited)
+        return "Available all year";
+    if (startDate && endDate)
+        return `Available ${startDate} to ${endDate}`;
+    if (startDate)
+        return `Available from ${startDate}`;
+    if (endDate)
+        return `Available until ${endDate}`;
+    return null;
+}
+export function TourPricing({ tour }) {
+    const { selected } = useTourPartySize();
+    const hasPartyPricing = tour.pricing.partySize !== null;
+    const headline = selected
+        ? { amount: selected.perPerson, label: "per person" }
+        : tour.pricing.fromPerPerson
+            ? { amount: tour.pricing.fromPerPerson.formatted, label: "per person, from" }
+            : tour.pricing.total
+                ? { amount: tour.pricing.total.formatted, label: "total" }
+                : null;
+    const availability = availabilityNote(tour);
+    return (_jsxs("div", { className: "qt-panel qt-pricing", id: "quest-pricing", children: [_jsx("p", { className: "qt-panel-eyebrow", children: "Price" }), _jsx("p", { className: "qt-pricing-headline", children: headline ? (_jsxs(_Fragment, { children: [_jsx("strong", { children: headline.amount }), " ", _jsx("span", { children: headline.label })] })) : (_jsx("span", { children: "Price on request" })) }), hasPartyPricing ? _jsx(TourPartySizeFields, { tour: tour, idPrefix: "quest-pricing" }) : null, selected ? (_jsxs("dl", { className: "qt-pricing-rows", children: [_jsxs("div", { children: [_jsx("dt", { children: "Total for your group" }), _jsx("dd", { children: selected.total })] }), selected.vehicleCapacityLabel ? (_jsxs("div", { children: [_jsx("dt", { children: "Vehicle" }), _jsx("dd", { children: selected.vehicleCapacityLabel })] })) : null] })) : null, tour.pricing.lineItems.length > 0 ? (_jsxs("details", { className: "qt-pricing-breakdown", children: [_jsxs("summary", { children: ["Price breakdown ", _jsx(Icon.Chevron, {})] }), _jsx("table", { children: _jsx("tbody", { children: tour.pricing.lineItems.map((item, index) => (_jsxs("tr", { children: [_jsxs("th", { scope: "row", children: [item.name, item.qty ? _jsxs("span", { className: "qt-muted", children: [" x ", item.qty] }) : null] }), _jsx("td", { children: item.total })] }, `${item.name}-${index}`))) }) })] })) : null, availability ? _jsx("p", { className: "qt-muted qt-small", children: availability }) : null, hasPartyPricing ? (_jsx("p", { className: "qt-muted qt-small", children: "Indicative price for the selected group size. Final quote confirmed by the operator." })) : null] }));
+}

package/dist/react/sections.d.ts

@@ -0,0 +1,10 @@
+import { type TourSectionProps } from "./shared.js";
+export declare function TourHero({ tour }: TourSectionProps): import("react").JSX.Element;
+export declare function TourOverview({ tour }: TourSectionProps): import("react").JSX.Element | null;
+export declare function TourHighlights({ tour }: TourSectionProps): import("react").JSX.Element | null;
+export declare function TourItinerary({ tour }: TourSectionProps): import("react").JSX.Element | null;
+export declare function TourAccommodation({ tour }: TourSectionProps): import("react").JSX.Element | null;
+export declare function TourVehicle({ tour }: TourSectionProps): import("react").JSX.Element | null;
+export declare function TourInclusions({ tour }: TourSectionProps): import("react").JSX.Element | null;
+export declare function TourPaymentTerms({ tour }: TourSectionProps): import("react").JSX.Element | null;
+export declare function TourRelated({ tour, hrefFor, LinkComponent }: TourSectionProps): import("react").JSX.Element | null;

package/dist/react/sections.js

@@ -0,0 +1,58 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { TourCard } from "./tour-card.js";
+import { Icon, routeLabel, TourImg, TourSection, } from "./shared.js";
+export function TourHero({ tour }) {
+    const route = routeLabel(tour);
+    const price = tour.price.fromPerPerson ?? tour.price.total;
+    return (_jsxs("header", { className: "qt-hero", children: [_jsxs("div", { className: "qt-hero-media", children: [tour.heroImage ? (_jsx(TourImg, { image: tour.heroImage, sizes: "100vw", priority: true, className: "qt-hero-image" })) : null, _jsx("div", { className: "qt-hero-overlay" })] }), _jsxs("div", { className: "qt-hero-content", children: [_jsx("p", { className: "qt-hero-eyebrow", children: tour.operator.name }), _jsx("h1", { className: "qt-hero-title", children: tour.title }), tour.summary ? _jsx("p", { className: "qt-hero-lede", children: tour.summary }) : null, _jsxs("ul", { className: "qt-hero-meta", children: [_jsxs("li", { children: [_jsx(Icon.Clock, {}), tour.durationLabel] }), route ? (_jsxs("li", { children: [_jsx(Icon.Route, {}), route] })) : null, tour.tags.slice(0, 3).map((tag) => (_jsx("li", { children: tag.label }, tag.slug)))] }), _jsxs("div", { className: "qt-hero-actions", children: [price ? (_jsxs("p", { className: "qt-hero-price", children: [tour.price.fromPerPerson ? "From " : "", _jsx("strong", { children: price.formatted }), tour.price.fromPerPerson ? " per person" : " total"] })) : null, _jsx("a", { className: "qt-button", href: "#quest-enquiry", children: "Enquire now" })] })] })] }));
+}
+export function TourOverview({ tour }) {
+    if (tour.overview.length === 0)
+        return null;
+    return (_jsx(TourSection, { id: "quest-overview", title: "Trip overview", children: _jsx("div", { className: "qt-prose", children: tour.overview.map((paragraph, index) => (_jsx("p", { children: paragraph }, index))) }) }));
+}
+export function TourHighlights({ tour }) {
+    if (tour.highlights.length === 0)
+        return null;
+    return (_jsx(TourSection, { id: "quest-highlights", title: "Highlights", children: _jsx("ul", { className: "qt-highlights", children: tour.highlights.map((highlight) => (_jsxs("li", { className: "qt-highlight", children: [_jsx("span", { className: "qt-highlight-icon", children: _jsx(Icon.Check, {}) }), highlight] }, highlight))) }) }));
+}
+function ItineraryDay({ day, index }) {
+    const groupedActivities = day.activityGroups.filter((group) => group.activities.length > 0);
+    const hasActivities = groupedActivities.length > 0 || day.activities.length > 0;
+    const images = [day.image, ...day.gallery].filter((image) => image !== null).slice(0, 2);
+    return (_jsx("li", { className: "qt-day", children: _jsxs("details", { open: true, children: [_jsxs("summary", { className: "qt-day-summary", children: [_jsx("span", { className: "qt-day-badge", children: index + 1 }), _jsxs("span", { className: "qt-day-heading", children: [_jsxs("span", { className: "qt-day-label", children: [day.dayLabel, day.dateLabel ? ` · ${day.dateLabel}` : ""] }), _jsx("h3", { className: "qt-day-title", children: day.title })] }), _jsx(Icon.Chevron, {})] }), _jsxs("div", { className: "qt-day-body", children: [images.length > 0 ? (_jsx("div", { className: `qt-day-images${images.length === 2 ? " is-two" : ""}`, children: images.map((image) => (_jsx(TourImg, { image: image, sizes: "(min-width: 768px) 40vw, 100vw" }, image.url))) })) : null, day.description ? _jsx("p", { className: "qt-day-description", children: day.description }) : null, _jsxs("dl", { className: "qt-day-facts", children: [day.destination ? (_jsxs("div", { children: [_jsxs("dt", { children: [_jsx(Icon.Pin, {}), " Destination"] }), _jsx("dd", { children: day.destination })] })) : null, day.accommodation ? (_jsxs("div", { children: [_jsxs("dt", { children: [_jsx(Icon.Bed, {}), " ", day.accommodation.label || "Accommodation"] }), _jsx("dd", { children: day.accommodation.name })] })) : null, day.mealPlan ? (_jsxs("div", { children: [_jsxs("dt", { children: [_jsx(Icon.Meal, {}), " Meals"] }), _jsx("dd", { children: day.mealPlan })] })) : null] }), hasActivities ? (_jsxs("div", { className: "qt-day-activities", children: [groupedActivities.map((group) => (_jsxs("div", { className: "qt-activity-group", children: [group.title ? _jsx("p", { className: "qt-activity-group-title", children: group.title }) : null, _jsx(ActivityList, { activities: group.activities })] }, group.title))), day.activities.length > 0 ? _jsx(ActivityList, { activities: day.activities }) : null] })) : null] })] }) }));
+}
+function ActivityList({ activities }) {
+    return (_jsx("ul", { className: "qt-activities", children: activities.map((activity, index) => (_jsxs("li", { children: [_jsx(Icon.Check, {}), _jsxs("span", { children: [activity.time ? _jsxs("span", { className: "qt-activity-time", children: [activity.time, " "] }) : null, activity.name, activity.location ? _jsxs("span", { className: "qt-muted", children: [" \u00B7 ", activity.location] }) : null, activity.notes ? _jsx("span", { className: "qt-activity-notes", children: activity.notes }) : null] })] }, `${activity.name}-${index}`))) }));
+}
+export function TourItinerary({ tour }) {
+    if (tour.days.length === 0)
+        return null;
+    return (_jsx(TourSection, { id: "quest-itinerary", title: "Day-by-day itinerary", description: `${tour.days.length} ${tour.days.length === 1 ? "day" : "days"} planned for you`, children: _jsx("ol", { className: "qt-itinerary", children: tour.days.map((day, index) => (_jsx(ItineraryDay, { day: day, index: index }, `${day.dayLabel}-${index}`))) }) }));
+}
+export function TourAccommodation({ tour }) {
+    if (tour.lodging.length === 0)
+        return null;
+    return (_jsx(TourSection, { id: "quest-accommodation", title: "Where you will stay", children: _jsx("ul", { className: "qt-lodging", children: tour.lodging.map((lodge) => (_jsxs("li", { className: "qt-lodge", children: [lodge.image ? (_jsx(TourImg, { image: lodge.image, sizes: "(min-width: 768px) 33vw, 100vw", className: "qt-lodge-image" })) : null, _jsxs("div", { className: "qt-lodge-body", children: [lodge.label ? _jsx("p", { className: "qt-lodge-label", children: lodge.label }) : null, _jsx("h3", { className: "qt-lodge-name", children: lodge.name }), lodge.detail ? _jsx("p", { className: "qt-muted qt-small", children: lodge.detail }) : null, lodge.nights.length > 0 ? (_jsxs("p", { className: "qt-small", children: [_jsx(Icon.Bed, {}), " ", lodge.nights.length, " ", lodge.nights.length === 1 ? "night" : "nights"] })) : null, lodge.mealPlan ? (_jsxs("p", { className: "qt-small", children: [_jsx(Icon.Meal, {}), " ", lodge.mealPlan] })) : null] })] }, lodge.name))) }) }));
+}
+export function TourVehicle({ tour }) {
+    const vehicle = tour.vehicle;
+    if (!vehicle)
+        return null;
+    return (_jsx(TourSection, { id: "quest-vehicle", title: "Your safari vehicle", children: _jsxs("div", { className: "qt-vehicle", children: [vehicle.image ? (_jsx(TourImg, { image: vehicle.image, sizes: "(min-width: 768px) 40vw, 100vw", className: "qt-vehicle-image" })) : null, _jsxs("div", { children: [_jsxs("h3", { className: "qt-vehicle-name", children: [_jsx(Icon.Car, {}), " ", vehicle.name] }), vehicle.description ? _jsx("p", { className: "qt-muted", children: vehicle.description }) : null, vehicle.maxPassengers ? (_jsxs("p", { className: "qt-small", children: [_jsx(Icon.Users, {}), " Up to ", vehicle.maxPassengers, " passengers"] })) : null, vehicle.features.length > 0 ? (_jsx("ul", { className: "qt-checklist", children: vehicle.features.map((feature) => (_jsxs("li", { children: [_jsx(Icon.Check, {}), feature] }, feature))) })) : null] })] }) }));
+}
+export function TourInclusions({ tour }) {
+    if (tour.inclusions.length === 0 && tour.exclusions.length === 0)
+        return null;
+    return (_jsx(TourSection, { id: "quest-inclusions", title: "What is included", children: _jsxs("div", { className: "qt-inclusions", children: [tour.inclusions.length > 0 ? (_jsxs("div", { className: "qt-inclusions-column", children: [_jsx("h3", { className: "qt-inclusions-title", children: "Included" }), _jsx("ul", { className: "qt-checklist", children: tour.inclusions.map((item) => (_jsxs("li", { children: [_jsx(Icon.Check, {}), item] }, item))) })] })) : null, tour.exclusions.length > 0 ? (_jsxs("div", { className: "qt-inclusions-column", children: [_jsx("h3", { className: "qt-inclusions-title", children: "Not included" }), _jsx("ul", { className: "qt-checklist is-excluded", children: tour.exclusions.map((item) => (_jsxs("li", { children: [_jsx(Icon.X, {}), item] }, item))) })] })) : null] }) }));
+}
+export function TourPaymentTerms({ tour }) {
+    if (tour.paymentTerms.length === 0 && !tour.paymentNote)
+        return null;
+    return (_jsxs(TourSection, { id: "quest-payment-terms", title: "Payment terms", children: [tour.paymentTerms.length > 0 ? (_jsx("ul", { className: "qt-terms", children: tour.paymentTerms.map((term) => (_jsx("li", { children: term }, term))) })) : null, tour.paymentNote ? _jsx("p", { className: "qt-muted", children: tour.paymentNote }) : null] }));
+}
+export function TourRelated({ tour, hrefFor, LinkComponent }) {
+    if (tour.related.length === 0)
+        return null;
+    return (_jsx(TourSection, { id: "quest-related", title: "You may also like", children: _jsx("ul", { className: "qt-grid", children: tour.related.slice(0, 3).map((related) => (_jsx("li", { className: "qt-grid-item", children: _jsx(TourCard, { tour: related, href: hrefFor(related.slug), LinkComponent: LinkComponent }) }, related.slug))) }) }));
+}

package/dist/react/shared.d.ts

@@ -0,0 +1,50 @@
+import type { ComponentType, ReactNode } from "react";
+import type { Tour, TourImage } from "../schema/index.js";
+export type TourLinkProps = {
+    href: string;
+    className?: string;
+    children?: ReactNode;
+    "aria-label"?: string;
+};
+/** Pass `next/link` (or your router's link) to get client-side navigation. Defaults to `<a>`. */
+export type TourLinkComponent = ComponentType<TourLinkProps> | "a";
+/** Props every detail section receives. Use this type for your own section overrides. */
+export type TourSectionProps = {
+    tour: Tour;
+    hrefFor: (slug: string) => string;
+    LinkComponent: TourLinkComponent;
+};
+export declare function TourLink({ LinkComponent, ...props }: TourLinkProps & {
+    LinkComponent: TourLinkComponent;
+}): import("react").JSX.Element;
+export declare function defaultHrefFor(hrefBase: string): (slug: string) => string;
+export declare function TourImg({ image, sizes, className, priority, }: {
+    image: TourImage;
+    sizes: string;
+    className?: string;
+    priority?: boolean;
+}): import("react").JSX.Element;
+export declare function TourSection({ id, title, description, children, }: {
+    id: string;
+    title: string;
+    description?: string | null;
+    children: ReactNode;
+}): import("react").JSX.Element;
+export declare const Icon: {
+    Clock: () => import("react").JSX.Element;
+    Pin: () => import("react").JSX.Element;
+    Bed: () => import("react").JSX.Element;
+    Meal: () => import("react").JSX.Element;
+    Check: () => import("react").JSX.Element;
+    X: () => import("react").JSX.Element;
+    Users: () => import("react").JSX.Element;
+    Car: () => import("react").JSX.Element;
+    Chevron: () => import("react").JSX.Element;
+    ArrowLeft: () => import("react").JSX.Element;
+    ArrowRight: () => import("react").JSX.Element;
+    Route: () => import("react").JSX.Element;
+};
+export declare function routeLabel(tour: {
+    startDestination: string | null;
+    endDestination: string | null;
+}): string | null;

package/dist/react/shared.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function TourLink({ LinkComponent, ...props }) {
+    if (LinkComponent === "a")
+        return _jsx("a", { ...props });
+    return _jsx(LinkComponent, { ...props });
+}
+export function defaultHrefFor(hrefBase) {
+    const base = hrefBase.replace(/\/+$/, "");
+    return (slug) => `${base}/${slug}`;
+}
+export function TourImg({ image, sizes, className, priority = false, }) {
+    return (_jsx("img", { src: image.url, srcSet: image.srcSet ?? undefined, sizes: image.srcSet ? sizes : undefined, alt: image.alt, width: image.width ?? undefined, height: image.height ?? undefined, loading: priority ? "eager" : "lazy", fetchPriority: priority ? "high" : undefined, decoding: "async", className: className }));
+}
+export function TourSection({ id, title, description, children, }) {
+    return (_jsxs("section", { id: id, className: "qt-section", "aria-labelledby": `${id}-title`, children: [_jsxs("div", { className: "qt-section-head", children: [_jsx("h2", { id: `${id}-title`, className: "qt-section-title", children: title }), description ? _jsx("p", { className: "qt-section-desc", children: description }) : null] }), children] }));
+}
+function Svg({ children, className }) {
+    return (_jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", className: `qt-icon ${className ?? ""}`.trim(), children: children }));
+}
+export const Icon = {
+    Clock: () => (_jsxs(Svg, { children: [_jsx("circle", { cx: "12", cy: "12", r: "10" }), _jsx("path", { d: "M12 6v6l4 2" })] })),
+    Pin: () => (_jsxs(Svg, { children: [_jsx("path", { d: "M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z" }), _jsx("circle", { cx: "12", cy: "10", r: "3" })] })),
+    Bed: () => (_jsx(Svg, { children: _jsx("path", { d: "M2 4v16M2 8h18a2 2 0 0 1 2 2v10M2 17h20M6 8v9" }) })),
+    Meal: () => (_jsx(Svg, { children: _jsx("path", { d: "M3 2v7c0 1.1.9 2 2 2h4a2 2 0 0 0 2-2V2M7 2v20M21 15V2a5 5 0 0 0-5 5v6c0 1.1.9 2 2 2h3Zm0 0v7" }) })),
+    Check: () => (_jsx(Svg, { children: _jsx("path", { d: "M20 6 9 17l-5-5" }) })),
+    X: () => (_jsx(Svg, { children: _jsx("path", { d: "M18 6 6 18M6 6l12 12" }) })),
+    Users: () => (_jsxs(Svg, { children: [_jsx("path", { d: "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }), _jsx("circle", { cx: "9", cy: "7", r: "4" }), _jsx("path", { d: "M22 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75" })] })),
+    Car: () => (_jsxs(Svg, { children: [_jsx("path", { d: "M19 17h2c.6 0 1-.4 1-1v-3c0-.9-.7-1.7-1.5-1.9L18 10l-2.7-3.6A2 2 0 0 0 13.7 6H6.3a2 2 0 0 0-1.6.8L2 10.5V16c0 .6.4 1 1 1h2" }), _jsx("circle", { cx: "7", cy: "17", r: "2" }), _jsx("circle", { cx: "17", cy: "17", r: "2" }), _jsx("path", { d: "M9 17h6" })] })),
+    Chevron: () => (_jsx(Svg, { className: "qt-chevron", children: _jsx("path", { d: "m6 9 6 6 6-6" }) })),
+    ArrowLeft: () => (_jsx(Svg, { children: _jsx("path", { d: "m15 18-6-6 6-6" }) })),
+    ArrowRight: () => (_jsx(Svg, { children: _jsx("path", { d: "m9 18 6-6-6-6" }) })),
+    Route: () => (_jsxs(Svg, { children: [_jsx("circle", { cx: "6", cy: "19", r: "3" }), _jsx("path", { d: "M9 19h8.5a3.5 3.5 0 0 0 0-7h-11a3.5 3.5 0 0 1 0-7H15" }), _jsx("circle", { cx: "18", cy: "5", r: "3" })] })),
+};
+export function routeLabel(tour) {
+    const { startDestination: start, endDestination: end } = tour;
+    if (start && end && start.toLowerCase() !== end.toLowerCase())
+        return `${start} to ${end}`;
+    return start ?? end ?? null;
+}

package/dist/react/tour-card.d.ts

@@ -0,0 +1,30 @@
+import type { ComponentType } from "react";
+import type { TourCard as TourCardData } from "../schema/index.js";
+import { type TourLinkComponent } from "./shared.js";
+export type TourCardProps = {
+    tour: TourCardData;
+    href: string;
+    LinkComponent?: TourLinkComponent;
+    /** Load the image eagerly (first row above the fold). */
+    priority?: boolean;
+    headingLevel?: "h2" | "h3";
+};
+export declare function TourCardPrice({ tour }: {
+    tour: TourCardData;
+}): import("react").JSX.Element | null;
+export declare function TourCard({ tour, href, LinkComponent, priority, headingLevel: Heading, }: TourCardProps): import("react").JSX.Element;
+export type TourGridProps = {
+    tours: TourCardData[];
+    /** Base path of your tour detail route. Default `/tours`, giving `/tours/<slug>`. */
+    hrefBase?: string;
+    /** Full control over card links. Overrides `hrefBase`. */
+    hrefFor?: (slug: string) => string;
+    LinkComponent?: TourLinkComponent;
+    /** Replace the card design while keeping the grid. */
+    CardComponent?: ComponentType<TourCardProps>;
+    /** Shown when there are no tours. */
+    emptyMessage?: string;
+    headingLevel?: "h2" | "h3";
+    className?: string;
+};
+export declare function TourGrid({ tours, hrefBase, hrefFor, LinkComponent, CardComponent, emptyMessage, headingLevel, className, }: TourGridProps): import("react").JSX.Element;

package/dist/react/tour-card.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { defaultHrefFor, Icon, routeLabel, TourImg, TourLink, } from "./shared.js";
+export function TourCardPrice({ tour }) {
+    if (tour.price.fromPerPerson) {
+        return (_jsxs("p", { className: "qt-card-price", children: [_jsx("span", { className: "qt-card-price-label", children: "From" }), " ", _jsx("strong", { children: tour.price.fromPerPerson.formatted }), " ", _jsx("span", { className: "qt-card-price-label", children: "per person" })] }));
+    }
+    if (tour.price.total) {
+        return (_jsxs("p", { className: "qt-card-price", children: [_jsx("strong", { children: tour.price.total.formatted }), " ", _jsx("span", { className: "qt-card-price-label", children: "total" })] }));
+    }
+    return null;
+}
+export function TourCard({ tour, href, LinkComponent = "a", priority = false, headingLevel: Heading = "h3", }) {
+    const route = routeLabel(tour);
+    return (_jsxs("article", { className: "qt-card", children: [_jsxs("div", { className: "qt-card-media", children: [tour.heroImage ? (_jsx(TourImg, { image: tour.heroImage, sizes: "(min-width: 1024px) 33vw, (min-width: 640px) 50vw, 100vw", priority: priority, className: "qt-card-image" })) : (_jsx("div", { className: "qt-card-image qt-card-image-empty", "aria-hidden": "true" })), _jsxs("span", { className: "qt-card-duration", children: [_jsx(Icon.Clock, {}), tour.durationLabel] })] }), _jsxs("div", { className: "qt-card-body", children: [tour.tags.length > 0 ? (_jsx("ul", { className: "qt-card-tags", "aria-label": "Tour types", children: tour.tags.slice(0, 2).map((tag) => (_jsx("li", { className: "qt-tag", children: tag.label }, tag.slug))) })) : null, _jsx(Heading, { className: "qt-card-title", children: _jsx(TourLink, { LinkComponent: LinkComponent, href: href, className: "qt-card-link", children: tour.title }) }), route ? (_jsxs("p", { className: "qt-card-route", children: [_jsx(Icon.Pin, {}), route] })) : null, tour.summary ? _jsx("p", { className: "qt-card-summary", children: tour.summary }) : null, tour.highlights.length > 0 ? (_jsx("ul", { className: "qt-card-highlights", children: tour.highlights.slice(0, 2).map((highlight) => (_jsxs("li", { children: [_jsx(Icon.Check, {}), highlight] }, highlight))) })) : null, _jsxs("div", { className: "qt-card-footer", children: [_jsx(TourCardPrice, { tour: tour }), _jsxs("span", { className: "qt-card-cta", "aria-hidden": "true", children: ["View tour", _jsx(Icon.ArrowRight, {})] })] })] })] }));
+}
+export function TourGrid({ tours, hrefBase = "/tours", hrefFor, LinkComponent = "a", CardComponent = TourCard, emptyMessage = "No tours available right now. Please check back soon.", headingLevel, className, }) {
+    const resolveHref = hrefFor ?? defaultHrefFor(hrefBase);
+    if (tours.length === 0) {
+        return (_jsx("div", { className: `quest-tours qt-empty ${className ?? ""}`.trim(), children: _jsx("p", { children: emptyMessage }) }));
+    }
+    return (_jsx("div", { className: `quest-tours ${className ?? ""}`.trim(), children: _jsx("ul", { className: "qt-grid", children: tours.map((tour, index) => (_jsx("li", { className: "qt-grid-item", children: _jsx(CardComponent, { tour: tour, href: resolveHref(tour.slug), LinkComponent: LinkComponent, priority: index < 3, headingLevel: headingLevel }) }, tour.slug))) }) }));
+}

package/dist/react/tour-detail.d.ts

@@ -0,0 +1,26 @@
+import type { ComponentType } from "react";
+import type { Tour } from "../schema/index.js";
+import { type TourLinkComponent, type TourSectionProps } from "./shared.js";
+/**
+ * Every section Quest models, in page order. There is no section for data Quest does not
+ * have, and each section renders nothing when the package has no data for it.
+ */
+export type TourSectionKey = "Hero" | "Overview" | "Highlights" | "Itinerary" | "Accommodation" | "Vehicle" | "Gallery" | "Inclusions" | "PaymentTerms" | "Pricing" | "Enquiry" | "Related";
+export type TourSectionComponents = Record<TourSectionKey, ComponentType<TourSectionProps>>;
+export declare const defaultTourSections: TourSectionComponents;
+export type TourDetailProps = {
+    tour: Tour;
+    /**
+     * Replace individual sections: `components={{ Itinerary: MyItinerary }}`. Overrides are
+     * rendered on the server; for a client component, wrap it and pass only `tour`.
+     */
+    components?: Partial<TourSectionComponents>;
+    /** Hide sections on this site, e.g. `hide={["PaymentTerms"]}`. */
+    hide?: TourSectionKey[];
+    /** Base path of your tour detail route, used for related tours. Default `/tours`. */
+    hrefBase?: string;
+    hrefFor?: (slug: string) => string;
+    LinkComponent?: TourLinkComponent;
+    className?: string;
+};
+export declare function TourDetail({ tour, components, hide, hrefBase, hrefFor, LinkComponent, className, }: TourDetailProps): import("react").JSX.Element;

package/dist/react/tour-detail.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { TourPartySizeProvider, TourPricing } from "./party-size.js";
+import { TourAccommodation, TourHero, TourHighlights, TourInclusions, TourItinerary, TourOverview, TourPaymentTerms, TourRelated, TourVehicle, } from "./sections.js";
+import { defaultHrefFor } from "./shared.js";
+import { TourContactPanel } from "./contact-panel.js";
+import { TourGallery } from "./tour-gallery.js";
+// Client sections get only `tour`: functions like `hrefFor` cannot cross the server/client boundary.
+function GallerySection({ tour }) {
+    return _jsx(TourGallery, { tour: tour });
+}
+function PricingSection({ tour }) {
+    return _jsx(TourPricing, { tour: tour });
+}
+function EnquirySection({ tour }) {
+    return _jsx(TourContactPanel, { tour: tour });
+}
+export const defaultTourSections = {
+    Hero: TourHero,
+    Overview: TourOverview,
+    Highlights: TourHighlights,
+    Itinerary: TourItinerary,
+    Accommodation: TourAccommodation,
+    Vehicle: TourVehicle,
+    Gallery: GallerySection,
+    Inclusions: TourInclusions,
+    PaymentTerms: TourPaymentTerms,
+    Pricing: PricingSection,
+    Enquiry: EnquirySection,
+    Related: TourRelated,
+};
+const MAIN_SECTIONS = [
+    "Overview",
+    "Highlights",
+    "Itinerary",
+    "Accommodation",
+    "Vehicle",
+    "Gallery",
+    "Inclusions",
+    "PaymentTerms",
+];
+export function TourDetail({ tour, components, hide = [], hrefBase = "/tours", hrefFor, LinkComponent = "a", className, }) {
+    const sections = { ...defaultTourSections, ...components };
+    const sectionProps = {
+        tour,
+        hrefFor: hrefFor ?? defaultHrefFor(hrefBase),
+        LinkComponent,
+    };
+    const render = (key) => {
+        if (hide.includes(key))
+            return null;
+        const Section = sections[key];
+        return _jsx(Section, { ...sectionProps }, key);
+    };
+    return (_jsx("article", { className: `quest-tours qt-detail ${className ?? ""}`.trim(), children: _jsxs(TourPartySizeProvider, { tour: tour, children: [render("Hero"), _jsxs("div", { className: "qt-layout", children: [_jsx("div", { className: "qt-main", children: MAIN_SECTIONS.map(render) }), _jsx("aside", { className: "qt-aside", "aria-label": "Price and enquiry", children: _jsxs("div", { className: "qt-aside-sticky", children: [render("Pricing"), render("Enquiry")] }) })] }), _jsx("div", { className: "qt-footer-sections", children: render("Related") })] }) }));
+}

package/dist/react/tour-gallery.d.ts

@@ -0,0 +1,4 @@
+import type { Tour } from "../schema/index.js";
+export declare function TourGallery({ tour }: {
+    tour: Tour;
+}): import("react").JSX.Element | null;

package/dist/react/tour-gallery.js

@@ -0,0 +1,35 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { Icon, TourImg, TourSection } from "./shared.js";
+const GRID_LIMIT = 9;
+export function TourGallery({ tour }) {
+    const dialogRef = useRef(null);
+    const [index, setIndex] = useState(null);
+    const images = tour.gallery;
+    const count = images.length;
+    const open = (next) => {
+        setIndex(next);
+        dialogRef.current?.showModal();
+    };
+    const step = useCallback((delta) => setIndex((current) => (current === null ? current : (current + delta + count) % count)), [count]);
+    useEffect(() => {
+        if (index === null)
+            return;
+        const onKey = (event) => {
+            if (event.key === "ArrowRight")
+                step(1);
+            if (event.key === "ArrowLeft")
+                step(-1);
+        };
+        window.addEventListener("keydown", onKey);
+        return () => window.removeEventListener("keydown", onKey);
+    }, [index, step]);
+    if (count === 0)
+        return null;
+    const active = index === null ? null : images[index];
+    return (_jsxs(TourSection, { id: "quest-gallery", title: "Gallery", children: [_jsx("ul", { className: "qt-gallery", children: images.slice(0, GRID_LIMIT).map((image, imageIndex) => (_jsx("li", { children: _jsxs("button", { type: "button", className: "qt-gallery-button", onClick: () => open(imageIndex), "aria-label": `View photo${image.alt ? `: ${image.alt}` : ""}`, children: [_jsx(TourImg, { image: image, sizes: "(min-width: 768px) 33vw, 50vw" }), imageIndex === GRID_LIMIT - 1 && count > GRID_LIMIT ? (_jsxs("span", { className: "qt-gallery-more", children: ["+", count - GRID_LIMIT] })) : null] }) }, image.url))) }), _jsxs("dialog", { ref: dialogRef, className: "qt-lightbox", onClose: () => setIndex(null), onClick: (event) => {
+                    if (event.target === dialogRef.current)
+                        dialogRef.current?.close();
+                }, children: [active ? (_jsxs("figure", { className: "qt-lightbox-figure", children: [_jsx("img", { src: active.url, srcSet: active.srcSet ?? undefined, sizes: "90vw", alt: active.alt }), _jsxs("figcaption", { children: [active.alt ? _jsx("span", { children: active.alt }) : null, _jsxs("span", { className: "qt-muted", children: [(index ?? 0) + 1, " / ", count] })] })] })) : null, _jsx("button", { type: "button", className: "qt-lightbox-close", onClick: () => dialogRef.current?.close(), "aria-label": "Close gallery", children: _jsx(Icon.X, {}) }), count > 1 ? (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", className: "qt-lightbox-nav is-prev", onClick: () => step(-1), "aria-label": "Previous photo", children: _jsx(Icon.ArrowLeft, {}) }), _jsx("button", { type: "button", className: "qt-lightbox-nav is-next", onClick: () => step(1), "aria-label": "Next photo", children: _jsx(Icon.ArrowRight, {}) })] })) : null] })] }));
+}

package/dist/react/tour-json-ld.d.ts

@@ -0,0 +1,7 @@
+import type { TourSeo } from "../schema/index.js";
+/** Escape `<` so JSON content can never close the script tag. */
+export declare function serializeJsonLd(value: unknown): string;
+/** Structured data Quest built for this page (TouristTrip, Offer, TravelAgency, breadcrumbs, images). */
+export declare function TourJsonLd({ seo }: {
+    seo: TourSeo | null;
+}): import("react").JSX.Element | null;

package/dist/react/tour-json-ld.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/** Escape `<` so JSON content can never close the script tag. */
+export function serializeJsonLd(value) {
+    return JSON.stringify(value).replace(/</g, "\\u003c");
+}
+/** Structured data Quest built for this page (TouristTrip, Offer, TravelAgency, breadcrumbs, images). */
+export function TourJsonLd({ seo }) {
+    if (!seo || seo.jsonLd.length === 0)
+        return null;
+    return (_jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: {
+            __html: serializeJsonLd(seo.jsonLd.length === 1 ? seo.jsonLd[0] : seo.jsonLd),
+        } }));
+}