@voyant-travel/bookings-react 0.119.3

package/dist/components/travelers-section.js

@@ -0,0 +1,355 @@
+// agent-quality: file-size exception -- owner: bookings-react; existing UI surface stays co-located until a dedicated split preserves behavior and tests.
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { usePerson, usePersonRelationships, } from "@voyant-travel/relationships-react";
+import { Button, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from "@voyant-travel/ui/components";
+import { Trash2, UserPlus } from "lucide-react";
+import * as React from "react";
+import { useBookingsUiMessagesOrDefault } from "../i18n/provider.js";
+import { createTravelerFromPerson, RelatedPersonChip, TravelerCategoryButtons, TravelerPersonPicker, TravelerPricingCategorySelect, } from "./travelers-section-controls.js";
+export const emptyTravelerListValue = { travelers: [] };
+function createClientTravelerKey() {
+    const random = typeof globalThis.crypto?.randomUUID === "function"
+        ? globalThis.crypto.randomUUID().replace(/-/g, "")
+        : `${Date.now().toString(36)}${Math.random().toString(36).slice(2)}`;
+    return `trav:${random}`;
+}
+/** Factory for a blank row — `role` defaults to `adult` unless the list is empty. */
+export function createBlankTraveler(role = "adult") {
+    return {
+        clientTravelerKey: createClientTravelerKey(),
+        personId: null,
+        firstName: "",
+        lastName: "",
+        email: "",
+        phone: "",
+        preferredLanguage: "",
+        role,
+        dateOfBirth: null,
+        pricingUnitId: null,
+        pricingCategoryId: null,
+        inventoryUnitId: null,
+        pricingUnitSource: "auto",
+        inventoryUnitSource: "auto",
+    };
+}
+// Re-export `computeAgeYears` from the canonical assignment module so
+// existing consumers of `travelers-section`'s public surface keep
+// working. The implementation lives in `@voyant-travel/bookings/pricing-assignment`.
+export { computeAgeYears } from "@voyant-travel/bookings/pricing-assignment";
+import { computeAgeYears as _computeAgeYears, matchUnitByDob as matchAssignmentUnitByDob, matchUnitByRoleHint as matchAssignmentUnitByRoleHint, } from "@voyant-travel/bookings/pricing-assignment";
+/**
+ * Derive the age-banded traveler role from DOB. Falls back to `adult`
+ * when DOB is missing so partial entries still typecheck downstream.
+ *
+ * Thresholds:
+ *   - infant: < 2
+ *   - child:  2 – 17
+ *   - adult:  18+
+ */
+export function deriveTravelerRoleFromDob(dob) {
+    const age = _computeAgeYears(dob);
+    if (age == null)
+        return "adult";
+    if (age < 2)
+        return "infant";
+    if (age < 18)
+        return "child";
+    return "adult";
+}
+function roleFromPricingCategoryType(categoryType) {
+    if (categoryType === "child")
+        return "child";
+    if (categoryType === "infant")
+        return "infant";
+    return "adult";
+}
+export function categoryMatchesDob(category, dob) {
+    if (category.minAge == null && category.maxAge == null)
+        return false;
+    const age = _computeAgeYears(dob);
+    if (age == null)
+        return false;
+    return ((category.minAge == null || age >= category.minAge) &&
+        (category.maxAge == null || age <= category.maxAge));
+}
+function categoryMatchesRole(category, role) {
+    if (role === "lead" || role === "adult")
+        return category.categoryType === "adult";
+    if (role === "child")
+        return category.categoryType === "child";
+    if (role === "infant")
+        return category.categoryType === "infant";
+    return false;
+}
+export function matchPricingCategoryForTraveler(categories, dob, role, inventoryUnitId) {
+    if (!categories || categories.length === 0)
+        return null;
+    const pool = inventoryUnitId
+        ? categories.filter((category) => category.unitIds.includes(inventoryUnitId))
+        : categories;
+    if (pool.length === 0)
+        return null;
+    return (pool.find((category) => categoryMatchesDob(category, dob))?.categoryId ??
+        pool.find((category) => categoryMatchesRole(category, role))?.categoryId ??
+        pool[0]?.categoryId ??
+        null);
+}
+/**
+ * Adapter from this file's `RoomGroupUnit` shape (UI-side, uses
+ * `unitId`) to the canonical `PricingAssignmentUnit` shape (uses
+ * `optionUnitId`). Phase 1 of voyant-travel/voyant#1267 will collapse these
+ * by renaming the UI shape.
+ */
+function roomGroupUnitsAsAssignmentUnits(units) {
+    return units.map((u) => ({
+        optionId: null,
+        optionUnitId: u.unitId,
+        unitName: u.unitName,
+        unitCode: u.unitCode,
+        minAge: u.minAge,
+        maxAge: u.maxAge,
+        unitType: u.unitType,
+    }));
+}
+function matchUnitByDob(units, dob) {
+    return matchAssignmentUnitByDob(roomGroupUnitsAsAssignmentUnits(units), dob);
+}
+function matchUnitByRoleHint(units, role) {
+    return matchAssignmentUnitByRoleHint(roomGroupUnitsAsAssignmentUnits(units), role);
+}
+const NO_ROOM = "__unassigned__";
+/**
+ * Traveler list for booking-create flows. Each row can point at an existing
+ * CRM person, create a new CRM person, or carry manual name/email details,
+ * plus role and optional room assignment.
+ *
+ * ### Parent contract
+ *
+ * At submit time, the parent:
+ * 1. Inserts a `booking_travelers` row per traveler with `participantType`
+ *    derived from the role (`lead` / `adult` → traveler; `child` / `infant`
+ *    → traveler with travelerCategory set).
+ * 2. Carries `personId` through when the traveler is tied to CRM, including
+ *    when the payer is also traveling.
+ * 3. Exactly one row should have `role: "lead"` — enforced at submit, not
+ *    here. The UI lets the operator pick whichever layout they want, then
+ *    the submit handler errors if the invariant isn't met.
+ */
+export function TravelersSection({ value, onChange, roomUnits, roomGroups, pricingCategories, billingPersonId, labels, }) {
+    const messages = useBookingsUiMessagesOrDefault();
+    const merged = { ...messages.travelersSection.labels, ...labels };
+    const billingPerson = usePerson(billingPersonId ?? undefined, {
+        enabled: Boolean(billingPersonId),
+    });
+    const updateAt = (index, patch) => {
+        const next = value.travelers.map((traveler, i) => i === index ? { ...traveler, ...patch } : traveler);
+        onChange({ travelers: next });
+    };
+    const removeAt = (index) => {
+        onChange({ travelers: value.travelers.filter((_, i) => i !== index) });
+    };
+    const pickPricingUnitIdForTraveler = React.useCallback((dateOfBirth = null, role = null, preferredUnitId = null) => {
+        if (!roomGroups || roomGroups.length === 0)
+            return null;
+        const group = (preferredUnitId
+            ? roomGroups.find((g) => g.primaryUnitId === preferredUnitId ||
+                g.units.some((u) => u.unitId === preferredUnitId))
+            : undefined) ?? roomGroups[0];
+        if (!group)
+            return null;
+        return (matchUnitByDob(group.units, dateOfBirth) ??
+            matchUnitByRoleHint(group.units, role) ??
+            group.units.find((unit) => unit.unitType == null || unit.unitType === "person")?.unitId ??
+            null);
+    }, [roomGroups]);
+    // Auto-pick a room with seats available so operators don't have to
+    // hunt for the dropdown on every traveler — they can still override
+    // manually via the Room select. Pricing is picked from the same
+    // option when the product exposes person tiers.
+    const pickAssignmentsForNewTraveler = React.useCallback((dateOfBirth = null, role = null) => {
+        if (!roomUnits || roomUnits.length === 0) {
+            return {
+                pricingUnitId: null,
+                pricingCategoryId: matchPricingCategoryForTraveler(pricingCategories, dateOfBirth, role, null),
+                inventoryUnitId: null,
+            };
+        }
+        const pickedRoom = roomUnits.find((unit) => unit.remainingCapacity > 0)?.unitId ?? null;
+        if (!pickedRoom || !roomGroups || roomGroups.length === 0) {
+            return {
+                pricingUnitId: null,
+                pricingCategoryId: matchPricingCategoryForTraveler(pricingCategories, dateOfBirth, role, pickedRoom),
+                inventoryUnitId: pickedRoom,
+            };
+        }
+        const pricingUnitId = pickPricingUnitIdForTraveler(dateOfBirth, role, pickedRoom);
+        return {
+            pricingUnitId,
+            pricingCategoryId: matchPricingCategoryForTraveler(pricingCategories, dateOfBirth, role, pickedRoom),
+            inventoryUnitId: pickedRoom,
+        };
+    }, [roomUnits, roomGroups, pricingCategories, pickPricingUnitIdForTraveler]);
+    // Note: there is no hydration effect any more. Travelers attached
+    // before the option-units queries resolve get null assignment ids
+    // and `*UnitSource: "auto"`; the resolver in
+    // `@voyant-travel/bookings/pricing-assignment` re-derives them at every
+    // preview/submit pass, and respects `"none"` (explicit No room) /
+    // `"manual"` (operator click) when set. Operator intent is now
+    // declarative on the row, not implicit in a one-shot effect.
+    const addRow = () => {
+        // First traveler defaults to `lead` so the operator doesn't have to
+        // remember to flip the role on the initial row.
+        const role = value.travelers.length === 0 ? "lead" : "adult";
+        const blank = createBlankTraveler(role);
+        onChange({
+            travelers: [
+                ...value.travelers,
+                {
+                    ...blank,
+                    ...pickAssignmentsForNewTraveler(null, role),
+                    pricingUnitSource: "auto",
+                    inventoryUnitSource: "auto",
+                },
+            ],
+        });
+    };
+    const addBillingPerson = () => {
+        if (!billingPerson.data)
+            return;
+        const role = value.travelers.length === 0 ? "lead" : "adult";
+        const traveler = createTravelerFromPerson(billingPerson.data, role);
+        onChange({
+            travelers: [
+                ...value.travelers,
+                {
+                    ...traveler,
+                    ...pickAssignmentsForNewTraveler(traveler.dateOfBirth, role),
+                    pricingUnitSource: "auto",
+                    inventoryUnitSource: "auto",
+                },
+            ],
+        });
+    };
+    const addRelatedPersonTraveler = (person) => {
+        const role = value.travelers.length === 0 ? "lead" : "adult";
+        const traveler = createTravelerFromPerson(person, role);
+        onChange({
+            travelers: [
+                ...value.travelers,
+                {
+                    ...traveler,
+                    ...pickAssignmentsForNewTraveler(traveler.dateOfBirth, role),
+                    pricingUnitSource: "auto",
+                    inventoryUnitSource: "auto",
+                },
+            ],
+        });
+    };
+    const hasBillingPersonTraveler = Boolean(billingPersonId && value.travelers.some((traveler) => traveler.personId === billingPersonId));
+    // Relationships of the billing person — surfaced as one-click "add as
+    // traveler" chips so the operator can populate family/companions
+    // without searching for them in the picker.
+    const relationshipsQuery = usePersonRelationships(billingPersonId ?? undefined, {
+        enabled: Boolean(billingPersonId),
+    });
+    const alreadyAddedIds = React.useMemo(() => new Set(value.travelers.map((t) => t.personId).filter(Boolean)), [value.travelers]);
+    const relatedPersonIds = React.useMemo(() => {
+        if (!billingPersonId)
+            return [];
+        const seen = new Set();
+        const out = [];
+        for (const rel of relationshipsQuery.data?.data ?? []) {
+            const otherId = rel.fromPersonId === billingPersonId ? rel.toPersonId : rel.fromPersonId;
+            if (seen.has(otherId) || alreadyAddedIds.has(otherId))
+                continue;
+            seen.add(otherId);
+            out.push({ id: otherId, kind: rel.kind });
+        }
+        return out;
+    }, [billingPersonId, relationshipsQuery.data?.data, alreadyAddedIds]);
+    // base-ui's Select reads labels via the `items` prop — without it,
+    // <SelectValue /> falls back to the raw value (the unit id). Memoize
+    // once for all rows so identity is stable across renders.
+    const roomSelectItems = React.useMemo(() => [
+        { label: merged.noRoom, value: NO_ROOM },
+        ...(roomUnits ?? []).map((unit) => ({ label: unit.unitName, value: unit.unitId })),
+    ], [roomUnits, merged.noRoom]);
+    return (_jsxs("div", { className: "flex flex-col gap-2 rounded-md border p-3", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx(Label, { children: merged.heading }), _jsx(Button, { type: "button", size: "sm", variant: "ghost", onClick: addRow, children: merged.addTraveler })] }), billingPersonId && !hasBillingPersonTraveler ? (_jsx("div", { children: _jsxs(Button, { type: "button", size: "sm", variant: "outline", onClick: addBillingPerson, disabled: !billingPerson.data, children: [_jsx(UserPlus, { className: "mr-1 h-3.5 w-3.5" }), merged.addBillingPerson] }) })) : null, relatedPersonIds.length > 0 ? (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx("span", { className: "text-xs text-muted-foreground", children: merged.relatedPeopleHeading }), _jsx("div", { className: "flex flex-wrap gap-1.5", children: relatedPersonIds.map((rel) => (_jsx(RelatedPersonChip, { personId: rel.id, kind: rel.kind, addLabel: merged.addRelatedPerson, onAdd: addRelatedPersonTraveler }, rel.id))) })] })) : null, value.travelers.length === 0 ? (_jsx("p", { className: "text-xs text-muted-foreground", children: merged.empty })) : (_jsx("div", { className: "flex flex-col gap-2", children: value.travelers.map((traveler, index) => (_jsxs("div", { className: "flex flex-col gap-2 rounded-md border p-2", children: [_jsx(TravelerPersonPicker, { personId: traveler.personId, labels: merged, pinnedPeople: billingPerson.data ? [billingPerson.data] : [], onSelect: (person) => updateAt(index, {
+                                personId: person.id,
+                                firstName: person.firstName,
+                                lastName: person.lastName,
+                                email: person.email ?? "",
+                                phone: person.phone ?? "",
+                                preferredLanguage: person.preferredLanguage ?? "",
+                                dateOfBirth: person.dateOfBirth ?? null,
+                                // Re-derive auto-owned unit assignments when the
+                                // linked CRM person changes. Pricing and inventory
+                                // stay independent: a manual room does not freeze
+                                // DOB-driven pricing, and a manual category does
+                                // not move the room.
+                                ...(traveler.pricingUnitSource === "manual" ||
+                                    traveler.pricingUnitSource === "none"
+                                    ? {}
+                                    : {
+                                        pricingUnitId: pickPricingUnitIdForTraveler(person.dateOfBirth ?? null, traveler.role, traveler.inventoryUnitId),
+                                        pricingUnitSource: "auto",
+                                    }),
+                                pricingCategoryId: matchPricingCategoryForTraveler(pricingCategories, person.dateOfBirth ?? null, traveler.role, traveler.inventoryUnitId),
+                                ...(traveler.inventoryUnitSource === "manual" ||
+                                    traveler.inventoryUnitSource === "none"
+                                    ? {}
+                                    : {
+                                        inventoryUnitId: pickAssignmentsForNewTraveler(person.dateOfBirth ?? null, traveler.role).inventoryUnitId,
+                                        inventoryUnitSource: "auto",
+                                    }),
+                            }), onClear: () => updateAt(index, {
+                                personId: null,
+                                firstName: "",
+                                lastName: "",
+                                email: "",
+                                phone: "",
+                                preferredLanguage: "",
+                                dateOfBirth: null,
+                                ...(traveler.pricingUnitSource === "manual" ||
+                                    traveler.pricingUnitSource === "none"
+                                    ? {}
+                                    : {
+                                        pricingUnitId: pickPricingUnitIdForTraveler(null, traveler.role, traveler.inventoryUnitId),
+                                        pricingUnitSource: "auto",
+                                    }),
+                                pricingCategoryId: matchPricingCategoryForTraveler(pricingCategories, null, traveler.role, traveler.inventoryUnitId),
+                                ...(traveler.inventoryUnitSource === "manual" ||
+                                    traveler.inventoryUnitSource === "none"
+                                    ? {}
+                                    : {
+                                        inventoryUnitId: pickAssignmentsForNewTraveler(null, traveler.role)
+                                            .inventoryUnitId,
+                                        inventoryUnitSource: "auto",
+                                    }),
+                            }) }), _jsxs("div", { className: "grid grid-cols-2 gap-2", children: [pricingCategories ? (_jsx(TravelerPricingCategorySelect, { traveler: traveler, categories: pricingCategories, label: merged.category, onPickCategory: (category) => updateAt(index, {
+                                        pricingCategoryId: category.categoryId,
+                                        role: traveler.role === "lead" &&
+                                            roleFromPricingCategoryType(category.categoryType) === "adult"
+                                            ? "lead"
+                                            : roleFromPricingCategoryType(category.categoryType),
+                                    }) })) : (_jsx(TravelerCategoryButtons, { traveler: traveler, roomGroups: roomGroups, fallbackLabels: {
+                                        category: merged.category,
+                                        adult: merged.roleAdult,
+                                        child: merged.roleChild,
+                                        infant: merged.roleInfant,
+                                    }, onPickUnit: (unitId, nextRole, source) => updateAt(index, {
+                                        pricingUnitId: unitId,
+                                        role: nextRole,
+                                        // Only freeze as manual when the dynamic button
+                                        // actually picked a unit. Role-only clicks via
+                                        // the static fallback stay `auto` so the
+                                        // resolver can re-derive once real units load.
+                                        pricingUnitSource: source,
+                                    }) })), roomUnits && roomUnits.length > 0 ? (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx(Label, { className: "text-xs", children: merged.room }), _jsxs(Select, { items: roomSelectItems, value: traveler.inventoryUnitId ?? NO_ROOM, onValueChange: (v) => updateAt(index, {
+                                                inventoryUnitId: v === NO_ROOM || !v ? null : v,
+                                                inventoryUnitSource: v === NO_ROOM || !v ? "none" : "manual",
+                                                pricingCategoryId: matchPricingCategoryForTraveler(pricingCategories, traveler.dateOfBirth, traveler.role, v === NO_ROOM || !v ? null : v),
+                                            }), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: NO_ROOM, children: merged.noRoom }), roomUnits.map((unit) => (_jsx(SelectItem, { value: unit.unitId, disabled: unit.remainingCapacity <= 0 &&
+                                                                traveler.inventoryUnitId !== unit.unitId, children: unit.unitName }, unit.unitId)))] })] })] })) : null] }), _jsx("div", { className: "flex justify-end", children: _jsxs(Button, { type: "button", variant: "ghost", size: "sm", className: "h-7 text-destructive", onClick: () => removeAt(index), "aria-label": merged.remove, children: [_jsx(Trash2, { className: "mr-1 h-3.5 w-3.5" }), merged.remove] }) })] }, index))) }))] }));
+}

package/dist/components/voucher-picker-section.d.ts

@@ -0,0 +1,50 @@
+/** Details of a successfully-validated voucher. */
+export interface PickedVoucher {
+    id: string;
+    code: string;
+    label: string | null;
+    currency: string | null;
+    remainingAmountCents: number | null;
+    expiresAt: string | null;
+}
+export interface VoucherPickerValue {
+    /** Code typed by the operator. Not cleared on failure so they can correct a typo. */
+    code: string;
+    /** Populated only when the last validate call succeeded. */
+    picked: PickedVoucher | null;
+    /** Reason returned by the server when validate fails, or a client-side message. */
+    error: string | null;
+}
+export declare const emptyVoucherPickerValue: VoucherPickerValue;
+export interface VoucherPickerSectionProps {
+    value: VoucherPickerValue;
+    onChange: (value: VoucherPickerValue) => void;
+    /**
+     * Context for the validate call — when provided, the server rejects vouchers
+     * locked to a different booking / mismatched currency / insufficient balance.
+     */
+    bookingId?: string;
+    currency?: string;
+    amountCents?: number;
+    labels?: {
+        heading?: string;
+        codePlaceholder?: string;
+        apply?: string;
+        clear?: string;
+        remainingLabel?: string;
+        invalidLabel?: string;
+    };
+}
+/**
+ * Voucher picker for booking-create flows. Operator enters a code, clicks
+ * Apply, and the server-side `/v1/public/vouchers/validate` runs all the
+ * usual guards (status, expiry, currency, booking-assignment, balance).
+ *
+ * The section only *validates* — it doesn't redeem. Redemption happens when
+ * the parent calls `POST /v1/finance/vouchers/:id/redeem` at submit time,
+ * after the booking exists and the final amount is known. Validate being
+ * idempotent means the operator can try a code, correct a typo, and try
+ * again without leaving a trail.
+ */
+export declare function VoucherPickerSection({ value, onChange, bookingId, currency, amountCents, labels, }: VoucherPickerSectionProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=voucher-picker-section.d.ts.map

package/dist/components/voucher-picker-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"voucher-picker-section.d.ts","sourceRoot":"","sources":["../../src/components/voucher-picker-section.tsx"],"names":[],"mappings":"AAOA,mDAAmD;AACnD,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAA;IACvB,oBAAoB,EAAE,MAAM,GAAG,IAAI,CAAA;IACnC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;CACzB;AAED,MAAM,WAAW,kBAAkB;IACjC,qFAAqF;IACrF,IAAI,EAAE,MAAM,CAAA;IACZ,4DAA4D;IAC5D,MAAM,EAAE,aAAa,GAAG,IAAI,CAAA;IAC5B,mFAAmF;IACnF,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CACrB;AAED,eAAO,MAAM,uBAAuB,EAAE,kBAIrC,CAAA;AAED,MAAM,WAAW,yBAAyB;IACxC,KAAK,EAAE,kBAAkB,CAAA;IACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAA;IAC7C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE,MAAM,CAAA;QAChB,eAAe,CAAC,EAAE,MAAM,CAAA;QACxB,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,cAAc,CAAC,EAAE,MAAM,CAAA;QACvB,YAAY,CAAC,EAAE,MAAM,CAAA;KACtB,CAAA;CACF;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,WAAW,EACX,MAAM,GACP,EAAE,yBAAyB,2CAiH3B"}

package/dist/components/voucher-picker-section.js

@@ -0,0 +1,79 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { usePublicVoucherValidationMutation } from "@voyant-travel/finance-react";
+import { Button, Input, Label } from "@voyant-travel/ui/components";
+import { CheckCircle2, Loader2, XCircle } from "lucide-react";
+import { useBookingsUiI18nOrDefault, useBookingsUiMessagesOrDefault } from "../i18n/provider.js";
+export const emptyVoucherPickerValue = {
+    code: "",
+    picked: null,
+    error: null,
+};
+/**
+ * Voucher picker for booking-create flows. Operator enters a code, clicks
+ * Apply, and the server-side `/v1/public/vouchers/validate` runs all the
+ * usual guards (status, expiry, currency, booking-assignment, balance).
+ *
+ * The section only *validates* — it doesn't redeem. Redemption happens when
+ * the parent calls `POST /v1/finance/vouchers/:id/redeem` at submit time,
+ * after the booking exists and the final amount is known. Validate being
+ * idempotent means the operator can try a code, correct a typo, and try
+ * again without leaving a trail.
+ */
+export function VoucherPickerSection({ value, onChange, bookingId, currency, amountCents, labels, }) {
+    const { formatCurrency } = useBookingsUiI18nOrDefault();
+    const messages = useBookingsUiMessagesOrDefault();
+    const merged = { ...messages.voucherPickerSection.labels, ...labels };
+    const validate = usePublicVoucherValidationMutation();
+    const handleApply = async () => {
+        const code = value.code.trim();
+        if (!code)
+            return;
+        try {
+            const { data } = await validate.mutateAsync({
+                code,
+                bookingId: bookingId ?? undefined,
+                currency: currency ?? undefined,
+                amountCents: amountCents ?? undefined,
+            });
+            if (data.valid && data.voucher) {
+                onChange({
+                    code,
+                    picked: {
+                        id: data.voucher.id,
+                        code: data.voucher.code,
+                        label: data.voucher.label,
+                        currency: data.voucher.currency,
+                        remainingAmountCents: data.voucher.remainingAmountCents,
+                        expiresAt: data.voucher.expiresAt,
+                    },
+                    error: null,
+                });
+                return;
+            }
+            onChange({
+                code,
+                picked: null,
+                error: messages.voucherPickerSection.reasonMessages[data.reason] ?? messages.voucherPickerSection.validation.invalid,
+            });
+        }
+        catch (err) {
+            onChange({
+                code,
+                picked: null,
+                error: err instanceof Error
+                    ? err.message
+                    : messages.voucherPickerSection.validation.lookupFailed,
+            });
+        }
+    };
+    const handleClear = () => onChange(emptyVoucherPickerValue);
+    return (_jsxs("div", { className: "flex flex-col gap-2 rounded-md border p-3", children: [_jsx(Label, { children: merged.heading }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Input, { value: value.code, onChange: (e) => onChange({ ...value, code: e.target.value, error: null }), onKeyDown: (e) => {
+                            if (e.key === "Enter") {
+                                e.preventDefault();
+                                void handleApply();
+                            }
+                        }, placeholder: merged.codePlaceholder, disabled: validate.isPending || Boolean(value.picked) }), value.picked ? (_jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: handleClear, children: merged.clear })) : (_jsxs(Button, { type: "button", size: "sm", onClick: () => void handleApply(), disabled: validate.isPending || !value.code.trim(), children: [validate.isPending && _jsx(Loader2, { className: "mr-1 h-3.5 w-3.5 animate-spin" }), merged.apply] }))] }), value.picked && (_jsxs("div", { className: "flex items-center gap-2 text-sm", children: [_jsx(CheckCircle2, { className: "h-4 w-4 text-emerald-600" }), _jsxs("span", { children: [merged.remainingLabel, " ", _jsx("strong", { children: value.picked.remainingAmountCents == null || !value.picked.currency
+                                    ? messages.voucherPickerSection.validation.amountUnavailable
+                                    : formatCurrency(value.picked.remainingAmountCents / 100, value.picked.currency) })] })] })), value.error && (_jsxs("div", { className: "flex items-start gap-2 text-sm text-destructive", children: [_jsx(XCircle, { className: "mt-0.5 h-4 w-4" }), _jsxs("span", { children: [merged.invalidLabel, " ", value.error] })] }))] }));
+}

package/dist/extras/client.d.ts

@@ -0,0 +1,14 @@
+import type { z } from "zod";
+export type VoyantFetcher = (url: string, init?: RequestInit) => Promise<Response>;
+export declare const defaultFetcher: VoyantFetcher;
+export declare class VoyantApiError extends Error {
+    readonly status: number;
+    readonly body: unknown;
+    constructor(message: string, status: number, body: unknown);
+}
+export interface FetchWithValidationOptions {
+    baseUrl: string;
+    fetcher: VoyantFetcher;
+}
+export declare function fetchWithValidation<TOut>(path: string, schema: z.ZodType<TOut>, options: FetchWithValidationOptions, init?: RequestInit): Promise<TOut>;
+//# sourceMappingURL=client.d.ts.map

package/dist/extras/client.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../src/extras/client.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,CAAC,EAAE,MAAM,KAAK,CAAA;AAE5B,MAAM,MAAM,aAAa,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,WAAW,KAAK,OAAO,CAAC,QAAQ,CAAC,CAAA;AAElF,eAAO,MAAM,cAAc,EAAE,aACoB,CAAA;AAEjD,qBAAa,cAAe,SAAQ,KAAK;IACvC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAA;gBAEV,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO;CAM3D;AAaD,MAAM,WAAW,0BAA0B;IACzC,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,aAAa,CAAA;CACvB;AAED,wBAAsB,mBAAmB,CAAC,IAAI,EAC5C,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,EACvB,OAAO,EAAE,0BAA0B,EACnC,IAAI,CAAC,EAAE,WAAW,GACjB,OAAO,CAAC,IAAI,CAAC,CA8Bf"}

package/dist/extras/client.js

@@ -0,0 +1,58 @@
+export const defaultFetcher = (url, init) => fetch(url, { credentials: "include", ...init });
+export class VoyantApiError extends Error {
+    status;
+    body;
+    constructor(message, status, body) {
+        super(message);
+        this.name = "VoyantApiError";
+        this.status = status;
+        this.body = body;
+    }
+}
+function extractErrorMessage(status, statusText, body) {
+    if (typeof body === "object" && body !== null && "error" in body) {
+        const err = body.error;
+        if (typeof err === "string")
+            return err;
+        if (typeof err === "object" && err !== null && "message" in err) {
+            return String(err.message);
+        }
+    }
+    return `Voyant API error: ${status} ${statusText}`;
+}
+export async function fetchWithValidation(path, schema, options, init) {
+    const url = joinUrl(options.baseUrl, path);
+    const headers = new Headers(init?.headers);
+    if (init?.body !== undefined && !headers.has("Content-Type")) {
+        headers.set("Content-Type", "application/json");
+    }
+    const response = await options.fetcher(url, { ...init, headers });
+    if (!response.ok) {
+        const body = await safeJson(response);
+        throw new VoyantApiError(extractErrorMessage(response.status, response.statusText, body), response.status, body);
+    }
+    if (response.status === 204)
+        return schema.parse(undefined);
+    const body = await safeJson(response);
+    const parsed = schema.safeParse(body);
+    if (!parsed.success) {
+        throw new VoyantApiError(`Voyant API response failed validation: ${parsed.error.message}`, response.status, body);
+    }
+    return parsed.data;
+}
+async function safeJson(response) {
+    const text = await response.text();
+    if (!text)
+        return undefined;
+    try {
+        return JSON.parse(text);
+    }
+    catch {
+        return text;
+    }
+}
+function joinUrl(baseUrl, path) {
+    const trimmedBase = baseUrl.endsWith("/") ? baseUrl.slice(0, -1) : baseUrl;
+    const trimmedPath = path.startsWith("/") ? path : `/${path}`;
+    return `${trimmedBase}${trimmedPath}`;
+}

package/dist/extras/components/extra-catalog-card.d.ts

@@ -0,0 +1,13 @@
+import type { CatalogSearchHit } from "@voyant-travel/catalog-react";
+export interface ExtraCatalogCardProps {
+    hit: CatalogSearchHit;
+    onClick?: (hit: CatalogSearchHit) => void;
+    className?: string;
+}
+/**
+ * Search-result card for an extras hit (sub-line-item add-ons attached
+ * to bookings). Reads: `name`, `category`, `priceCents`, `currency`,
+ * `unit` (per_person | per_booking | per_night), `tags`.
+ */
+export declare function ExtraCatalogCard({ hit, onClick, className }: ExtraCatalogCardProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=extra-catalog-card.d.ts.map

package/dist/extras/components/extra-catalog-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"extra-catalog-card.d.ts","sourceRoot":"","sources":["../../../src/extras/components/extra-catalog-card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAA;AAMpE,MAAM,WAAW,qBAAqB;IACpC,GAAG,EAAE,gBAAgB,CAAA;IACrB,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,gBAAgB,KAAK,IAAI,CAAA;IACzC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,qBAAqB,2CA8DlF"}

package/dist/extras/components/extra-catalog-card.js

@@ -0,0 +1,52 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge } from "@voyant-travel/ui/components/badge";
+import { Card, CardContent } from "@voyant-travel/ui/components/card";
+import { cn } from "@voyant-travel/ui/lib/utils";
+import { useExtrasUiI18nOrDefault } from "../i18n/index.js";
+/**
+ * Search-result card for an extras hit (sub-line-item add-ons attached
+ * to bookings). Reads: `name`, `category`, `priceCents`, `currency`,
+ * `unit` (per_person | per_booking | per_night), `tags`.
+ */
+export function ExtraCatalogCard({ hit, onClick, className }) {
+    const i18n = useExtrasUiI18nOrDefault();
+    const messages = i18n.messages.catalogCard;
+    const f = hit.document.fields;
+    const name = stringOr(f.name, messages.untitled);
+    const category = stringOr(f.category, null);
+    const unit = stringOr(f.unit, null);
+    const status = stringOr(f.status, null);
+    const tags = stringArray(f.tags);
+    const price = numberOr(f.priceCents, null);
+    const currency = stringOr(f.currency ?? f.sellCurrency, null);
+    const priceLabel = price != null && currency
+        ? i18n.formatCurrency(price / 100, currency, {
+            maximumFractionDigits: 2,
+        })
+        : null;
+    return (_jsx(Card, { className: cn("h-full cursor-pointer transition-colors hover:border-primary/40", onClick == null && "cursor-default", className), onClick: onClick ? () => onClick(hit) : undefined, children: _jsxs(CardContent, { className: "flex h-full flex-col gap-2 p-4", children: [_jsxs("div", { className: "flex items-start justify-between gap-2", children: [_jsx("h3", { className: "line-clamp-2 font-medium text-sm", children: name }), status && (_jsx(Badge, { variant: status === "active" ? "default" : "secondary", className: "shrink-0", children: status }))] }), _jsxs("div", { className: "flex flex-wrap items-center gap-2 text-muted-foreground text-xs", children: [category && _jsx("span", { children: category }), priceLabel && (_jsxs("span", { className: "ml-auto font-medium text-foreground", children: [priceLabel, unit && (_jsx("span", { className: "ml-1 text-muted-foreground", children: formatTemplate(messages.unitPrefix, { unit: unit.replace(/_/g, " ") }) }))] }))] }), tags.length > 0 && (_jsx("div", { className: "mt-auto flex flex-wrap gap-1", children: tags.slice(0, 4).map((tag) => (_jsx(Badge, { variant: "outline", className: "text-[10px]", children: tag }, tag))) }))] }) }));
+}
+function formatTemplate(template, values) {
+    return template.replace(/\{(\w+)\}/g, (_, key) => {
+        const value = values[key];
+        return value === undefined ? "" : String(value);
+    });
+}
+function stringOr(value, fallback) {
+    return typeof value === "string" && value.length > 0 ? value : fallback;
+}
+function numberOr(value, fallback) {
+    if (typeof value === "number")
+        return value;
+    if (typeof value === "string") {
+        const n = Number(value);
+        return Number.isFinite(n) ? n : fallback;
+    }
+    return fallback;
+}
+function stringArray(value) {
+    if (!Array.isArray(value))
+        return [];
+    return value.filter((v) => typeof v === "string" && v.length > 0);
+}

package/dist/extras/components/product-combobox.d.ts

@@ -0,0 +1,9 @@
+type Props = {
+    value: string | null | undefined;
+    onChange: (value: string | null) => void;
+    placeholder?: string;
+    disabled?: boolean;
+};
+export declare function ProductCombobox({ value, onChange, placeholder, disabled }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=product-combobox.d.ts.map

package/dist/extras/components/product-combobox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-combobox.d.ts","sourceRoot":"","sources":["../../../src/extras/components/product-combobox.tsx"],"names":[],"mappings":"AAgBA,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAA;IAChC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IACxC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAID,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,EAAE,KAAK,2CAyEhF"}