@voyantjs/bookings-ui 0.35.0 → 0.37.0

package/dist/journey/components/contract-preview-dialog.js

@@ -5,7 +5,9 @@ import { Checkbox } from "@voyantjs/ui/components/checkbox";
 import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle, } from "@voyantjs/ui/components/dialog";
 import { Skeleton } from "@voyantjs/ui/components/skeleton";
 import * as React from "react";
+import { formatMessage, useBookingsUiMessagesOrDefault } from "../../i18n/index.js";
 export function ContractPreviewDialog({ open, onOpenChange, variables, previewUrl, acceptLanguage, onAccept, marketingLabel, termsLabel, }) {
+    const messages = useBookingsUiMessagesOrDefault();
     const [loadState, setLoadState] = React.useState("idle");
     const [errorMessage, setErrorMessage] = React.useState(null);
     const [renderedHtml, setRenderedHtml] = React.useState("");
@@ -40,7 +42,9 @@ export function ContractPreviewDialog({ open, onOpenChange, variables, previewUr
         })
             .then(async (res) => {
             if (!res.ok) {
-                throw new Error(`Preview request failed: ${res.status}`);
+                throw new Error(formatMessage(messages.bookingJourney.contract.previewRequestFailed, {
+                    status: res.status,
+                }));
             }
             const json = (await res.json());
             if (cancelled)
@@ -48,7 +52,7 @@ export function ContractPreviewDialog({ open, onOpenChange, variables, previewUr
             const body = json.data?.rendered ?? "";
             const tmpl = json.data?.template;
             if (!body || !tmpl) {
-                throw new Error("Preview response missing rendered body or template metadata");
+                throw new Error(messages.bookingJourney.contract.previewMissing);
             }
             setRenderedHtml(body);
             setTemplate({ id: tmpl.id, slug: tmpl.slug, name: tmpl.name });
@@ -78,8 +82,9 @@ export function ContractPreviewDialog({ open, onOpenChange, variables, previewUr
             renderedHtml,
         });
     };
-    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "flex h-[85vh] w-[95vw] max-w-4xl flex-col gap-0 p-0", children: [_jsxs(DialogHeader, { className: "border-b p-6 pb-4", children: [_jsx(DialogTitle, { children: template?.name ?? "Booking contract" }), _jsx("p", { className: "text-muted-foreground text-sm", children: "Please review the contract below. You can scroll through the document, then tick the boxes and click Accept to continue." })] }), _jsxs("div", { className: "flex-1 overflow-hidden bg-muted/30", children: [loadState === "loading" ? (_jsxs("div", { className: "space-y-3 p-6", children: [_jsx(Skeleton, { className: "h-6 w-1/2" }), _jsx(Skeleton, { className: "h-4 w-full" }), _jsx(Skeleton, { className: "h-4 w-5/6" }), _jsx(Skeleton, { className: "h-4 w-4/5" }), _jsx(Skeleton, { className: "h-4 w-full" })] })) : null, loadState === "error" ? (_jsx("div", { className: "p-6", children: _jsxs("p", { className: "text-destructive text-sm", children: ["Couldn't load the contract preview: ", errorMessage] }) })) : null, loadState === "ready" ? (_jsx("iframe", { title: `${template?.name ?? "Contract"} preview`, srcDoc: wrapPreviewHtml(renderedHtml), sandbox: "", className: "h-full w-full border-0 bg-white" })) : null] }), _jsxs(DialogFooter, { className: "border-t p-6 sm:flex-col sm:items-stretch sm:gap-3", children: [_jsxs("div", { className: "space-y-2 text-sm", children: [_jsxs("label", { className: "flex items-start gap-2", children: [_jsx(Checkbox, { checked: acceptedTerms, onCheckedChange: (v) => setAcceptedTerms(v === true), className: "mt-0.5" }), _jsx("span", { children: termsLabel ?? (_jsx(_Fragment, { children: "I have read and agree to the terms of this contract. I understand that this booking is binding once accepted." })) })] }), _jsxs("label", { className: "flex items-start gap-2", children: [_jsx(Checkbox, { checked: acceptedMarketing, onCheckedChange: (v) => setAcceptedMarketing(v === true), className: "mt-0.5" }), _jsx("span", { children: marketingLabel ??
-                                                "I'd like to receive occasional travel offers and updates by email. (You can unsubscribe at any time.)" })] })] }), _jsxs("div", { className: "flex justify-end gap-2", children: [_jsx(Button, { type: "button", variant: "outline", onClick: () => onOpenChange(false), children: "Cancel" }), _jsx(Button, { type: "button", disabled: !canAccept, onClick: handleAccept, children: "Accept and continue" })] })] })] }) }));
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "flex h-[85vh] w-[95vw] max-w-4xl flex-col gap-0 p-0", children: [_jsxs(DialogHeader, { className: "border-b p-6 pb-4", children: [_jsx(DialogTitle, { children: template?.name ?? messages.bookingJourney.contract.defaultTitle }), _jsx("p", { className: "text-muted-foreground text-sm", children: messages.bookingJourney.contract.description })] }), _jsxs("div", { className: "flex-1 overflow-hidden bg-muted/30", children: [loadState === "loading" ? (_jsxs("div", { className: "space-y-3 p-6", children: [_jsx(Skeleton, { className: "h-6 w-1/2" }), _jsx(Skeleton, { className: "h-4 w-full" }), _jsx(Skeleton, { className: "h-4 w-5/6" }), _jsx(Skeleton, { className: "h-4 w-4/5" }), _jsx(Skeleton, { className: "h-4 w-full" })] })) : null, loadState === "error" ? (_jsx("div", { className: "p-6", children: _jsxs("p", { className: "text-destructive text-sm", children: [messages.bookingJourney.contract.errorPrefix, " ", errorMessage] }) })) : null, loadState === "ready" ? (_jsx("iframe", { title: formatMessage(messages.bookingJourney.contract.iframeTitle, {
+                                name: template?.name ?? messages.bookingJourney.contract.defaultTitle,
+                            }), srcDoc: wrapPreviewHtml(renderedHtml), sandbox: "", className: "h-full w-full border-0 bg-white" })) : null] }), _jsxs(DialogFooter, { className: "border-t p-6 sm:flex-col sm:items-stretch sm:gap-3", children: [_jsxs("div", { className: "space-y-2 text-sm", children: [_jsxs("label", { className: "flex items-start gap-2", children: [_jsx(Checkbox, { checked: acceptedTerms, onCheckedChange: (v) => setAcceptedTerms(v === true), className: "mt-0.5" }), _jsx("span", { children: termsLabel ?? _jsx(_Fragment, { children: messages.bookingJourney.contract.termsLabel }) })] }), _jsxs("label", { className: "flex items-start gap-2", children: [_jsx(Checkbox, { checked: acceptedMarketing, onCheckedChange: (v) => setAcceptedMarketing(v === true), className: "mt-0.5" }), _jsx("span", { children: marketingLabel ?? messages.bookingJourney.contract.marketingLabel })] })] }), _jsxs("div", { className: "flex justify-end gap-2", children: [_jsx(Button, { type: "button", variant: "outline", onClick: () => onOpenChange(false), children: messages.bookingJourney.contract.cancel }), _jsx(Button, { type: "button", disabled: !canAccept, onClick: handleAccept, children: messages.bookingJourney.contract.acceptAndContinue })] })] })] }) }));
 }
 /**
  * Wrap the rendered template body in a self-contained light-theme HTML

package/dist/journey/components/journey-steps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"journey-steps.d.ts","sourceRoot":"","sources":["../../../src/journey/components/journey-steps.tsx"],"names":[],"mappings":"AAEA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAA;AAYzE,OAAO,EACL,KAAK,KAAK,EASX,MAAM,uBAAuB,CAAA;AAC9B,OAAO,KAAK,EACV,sBAAsB,EACtB,2BAA2B,EAC3B,8BAA8B,EAC9B,0BAA0B,EAC3B,MAAM,aAAa,CAAA;AAEpB,UAAU,eAAe;IACvB,KAAK,EAAE,KAAK,CAAA;IACZ,QAAQ,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAA;IAC/B,KAAK,EAAE,iBAAiB,CAAA;CACzB;AAMD,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,KAAK,GACN,EAAE,eAAe,GAAG;IACnB,YAAY,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAA;CACrC,GAAG,KAAK,CAAC,YAAY,CAYrB;AA+UD,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,uBAAuB,EACvB,YAAY,GACb,EAAE,eAAe,GAAG;IACnB,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,sBAAsB,KAAK,KAAK,CAAC,SAAS,CAAA;IAC5E,YAAY,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAA;CACrC,GAAG,KAAK,CAAC,YAAY,CA8JrB;AAMD,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,KAAK,EACL,2BAA2B,GAC5B,EAAE,eAAe,GAAG;IACnB,2BAA2B,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAA;CACrF,GAAG,KAAK,CAAC,YAAY,CAiFrB;AAmTD,wBAAgB,iBAAiB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,eAAe,GAAG,KAAK,CAAC,YAAY,CAmGjG;AA6DD,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,eAAe,GAAG,KAAK,CAAC,YAAY,CA8C1F;AAyDD,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,KAAK,EACL,YAAY,EACZ,kBAAkB,GACnB,EAAE,eAAe,GAAG;IACnB,YAAY,EAAE,2BAA2B,CAAA;IACzC,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,8BAA8B,KAAK,KAAK,CAAC,SAAS,CAAA;CAChF,GAAG,KAAK,CAAC,YAAY,CAuFrB;AA8ED,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAS,EACT,YAAY,EACZ,OAAO,GACR,EAAE;IACD,KAAK,EAAE,KAAK,CAAA;IACZ,QAAQ,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAA;IAC/B,YAAY,EAAE,OAAO,CAAA;IACrB,SAAS,EAAE,MAAM,IAAI,CAAA;IACrB,YAAY,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAA;IACpC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;CAC7B,GAAG,KAAK,CAAC,YAAY,CA2DrB"}
+{"version":3,"file":"journey-steps.d.ts","sourceRoot":"","sources":["../../../src/journey/components/journey-steps.tsx"],"names":[],"mappings":"AAEA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAA;AAYzE,OAAO,EACL,KAAK,KAAK,EASX,MAAM,uBAAuB,CAAA;AAC9B,OAAO,KAAK,EACV,sBAAsB,EACtB,2BAA2B,EAC3B,8BAA8B,EAC9B,0BAA0B,EAC3B,MAAM,aAAa,CAAA;AAEpB,UAAU,eAAe;IACvB,KAAK,EAAE,KAAK,CAAA;IACZ,QAAQ,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAA;IAC/B,KAAK,EAAE,iBAAiB,CAAA;CACzB;AAMD,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,KAAK,GACN,EAAE,eAAe,GAAG;IACnB,YAAY,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAA;CACrC,GAAG,KAAK,CAAC,YAAY,CAarB;AAiWD,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,uBAAuB,EACvB,YAAY,GACb,EAAE,eAAe,GAAG;IACnB,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,sBAAsB,KAAK,KAAK,CAAC,SAAS,CAAA;IAC5E,YAAY,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAA;CACrC,GAAG,KAAK,CAAC,YAAY,CA+JrB;AAMD,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,KAAK,EACL,2BAA2B,GAC5B,EAAE,eAAe,GAAG;IACnB,2BAA2B,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAA;CACrF,GAAG,KAAK,CAAC,YAAY,CAgFrB;AAkUD,wBAAgB,iBAAiB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,eAAe,GAAG,KAAK,CAAC,YAAY,CAsGjG;AAkED,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,eAAe,GAAG,KAAK,CAAC,YAAY,CAkD1F;AAyDD,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,KAAK,EACL,YAAY,EACZ,kBAAkB,GACnB,EAAE,eAAe,GAAG;IACnB,YAAY,EAAE,2BAA2B,CAAA;IACzC,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,8BAA8B,KAAK,KAAK,CAAC,SAAS,CAAA;CAChF,GAAG,KAAK,CAAC,YAAY,CAoFrB;AAwDD,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAS,EACT,YAAY,EACZ,OAAO,GACR,EAAE;IACD,KAAK,EAAE,KAAK,CAAA;IACZ,QAAQ,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAA;IAC/B,YAAY,EAAE,OAAO,CAAA;IACrB,SAAS,EAAE,MAAM,IAAI,CAAA;IACrB,YAAY,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAA;IACpC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;CAC7B,GAAG,KAAK,CAAC,YAAY,CAgErB"}

package/dist/journey/components/journey-steps.js

@@ -10,27 +10,36 @@ import { PhoneInput } from "@voyantjs/ui/components/phone-input";
 import { RadioGroup, RadioGroupItem } from "@voyantjs/ui/components/radio-group";
 import { Textarea } from "@voyantjs/ui/components/textarea";
 import { Loader2 } from "lucide-react";
+import { formatMessage, useBookingsUiMessagesOrDefault } from "../../i18n/index.js";
 import { patchBilling, patchConfigure, patchPaxCount, setAccommodation, setAddons, setPayment, setTravelers, totalPax, } from "../lib/draft-state.js";
 // ─────────────────────────────────────────────────────────────────
 // Configure
 // ─────────────────────────────────────────────────────────────────
 export function ConfigureStep({ draft, setDraft, shape, }) {
-    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: "Configure" }) }), _jsxs(CardContent, { className: "space-y-6", children: [_jsx(PaxBands, { draft: draft, setDraft: setDraft, shape: shape }), _jsx(DepartureFields, { draft: draft, setDraft: setDraft, shape: shape })] })] }));
+    const messages = useBookingsUiMessagesOrDefault();
+    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: messages.bookingJourney.steps.configure }) }), _jsxs(CardContent, { className: "space-y-6", children: [_jsx(PaxBands, { draft: draft, setDraft: setDraft, shape: shape }), _jsx(DepartureFields, { draft: draft, setDraft: setDraft, shape: shape })] })] }));
 }
 function PaxBands({ draft, setDraft, shape }) {
-    return (_jsxs("div", { className: "space-y-3", children: [_jsx(Label, { children: "Travelers" }), _jsx("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-3", children: shape.paxBands.map((band) => {
+    const messages = useBookingsUiMessagesOrDefault();
+    return (_jsxs("div", { className: "space-y-3", children: [_jsx(Label, { children: messages.bookingJourney.configure.travelers }), _jsx("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-3", children: shape.paxBands.map((band) => {
                     const value = draft.configure.pax?.[band.code] ?? 0;
-                    return (_jsxs("div", { className: "flex items-center justify-between rounded border p-3", children: [_jsxs("div", { children: [_jsx("div", { className: "font-medium", children: band.label }), band.minAge != null || band.maxAge != null ? (_jsx("div", { className: "text-muted-foreground text-xs", children: ageHint(band.minAge, band.maxAge) })) : null] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", size: "sm", type: "button", disabled: value <= band.minCount, onClick: () => setDraft(patchPaxCount(draft, band.code, value - 1)), children: "\u2212" }), _jsx("span", { className: "min-w-6 text-center", children: value }), _jsx(Button, { variant: "outline", size: "sm", type: "button", disabled: value >= band.maxCount, onClick: () => setDraft(patchPaxCount(draft, band.code, value + 1)), children: "+" })] })] }, band.code));
+                    return (_jsxs("div", { className: "flex items-center justify-between rounded border p-3", children: [_jsxs("div", { children: [_jsx("div", { className: "font-medium", children: band.label }), band.minAge != null || band.maxAge != null ? (_jsx("div", { className: "text-muted-foreground text-xs", children: ageHint(band.minAge, band.maxAge, messages) })) : null] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", size: "sm", type: "button", disabled: value <= band.minCount, onClick: () => setDraft(patchPaxCount(draft, band.code, value - 1)), children: "\u2212" }), _jsx("span", { className: "min-w-6 text-center", children: value }), _jsx(Button, { variant: "outline", size: "sm", type: "button", disabled: value >= band.maxCount, onClick: () => setDraft(patchPaxCount(draft, band.code, value + 1)), children: "+" })] })] }, band.code));
                 }) }), _jsx(PaxValidation, { draft: draft, shape: shape })] }));
 }
 function PaxValidation({ draft, shape, }) {
+    const messages = useBookingsUiMessagesOrDefault();
     const total = totalPax(draft);
     const { min, max } = shape.paxBandsAllowedTotal;
     if (total < min) {
-        return (_jsxs("p", { className: "text-sm text-amber-600", children: ["Add at least ", min, " traveler", min === 1 ? "" : "s", " to continue."] }));
+        return (_jsx("p", { className: "text-sm text-amber-600", children: formatMessage(messages.bookingJourney.validation.addAtLeastTravelers, {
+                count: min,
+                plural: min === 1 ? "" : "s",
+            }) }));
     }
     if (total > max) {
-        return _jsxs("p", { className: "text-sm text-destructive", children: ["Max ", max, " travelers per booking."] });
+        return (_jsx("p", { className: "text-sm text-destructive", children: formatMessage(messages.bookingJourney.validation.maxTravelersPerBooking, {
+                count: max,
+            }) }));
     }
     return null;
 }
@@ -64,52 +73,60 @@ function DepartureFields({ draft, setDraft, shape }) {
         }) }));
 }
 function DepartureBasic({ draft, setDraft, }) {
-    return (_jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(DateField, { id: "bj-departure-date", label: "Departure date", value: draft.configure.departureDate ?? "", onChange: (v) => setDraft(patchConfigure(draft, { departureDate: v })), range: "future" }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { htmlFor: "bj-departure-time", children: "Time (optional)" }), _jsx(Input, { id: "bj-departure-time", type: "time", value: draft.configure.departureTime ?? "", onChange: (e) => setDraft(patchConfigure(draft, { departureTime: e.target.value })) })] })] }));
+    const messages = useBookingsUiMessagesOrDefault();
+    return (_jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(DateField, { id: "bj-departure-date", label: messages.bookingJourney.configure.departureDate, value: draft.configure.departureDate ?? "", onChange: (v) => setDraft(patchConfigure(draft, { departureDate: v })), range: "future" }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { htmlFor: "bj-departure-time", children: messages.bookingJourney.configure.timeOptional }), _jsx(Input, { id: "bj-departure-time", type: "time", value: draft.configure.departureTime ?? "", onChange: (e) => setDraft(patchConfigure(draft, { departureTime: e.target.value })) })] })] }));
 }
 function DateRangeFields({ draft, setDraft, minNights, maxNights, }) {
+    const messages = useBookingsUiMessagesOrDefault();
     const range = draft.configure.dateRange;
-    return (_jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(DateField, { id: "bj-checkin", label: "Check-in", value: range?.checkIn ?? "", onChange: (v) => setDraft(patchConfigure(draft, {
+    return (_jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(DateField, { id: "bj-checkin", label: messages.bookingJourney.configure.checkIn, value: range?.checkIn ?? "", onChange: (v) => setDraft(patchConfigure(draft, {
                     dateRange: { checkIn: v, checkOut: range?.checkOut ?? "" },
-                })), range: "future" }), _jsx(DateField, { id: "bj-checkout", label: `Check-out (${minNights}–${maxNights} nights)`, value: range?.checkOut ?? "", onChange: (v) => setDraft(patchConfigure(draft, {
+                })), range: "future" }), _jsx(DateField, { id: "bj-checkout", label: formatMessage(messages.bookingJourney.configure.checkOutWithNights, {
+                    minNights,
+                    maxNights,
+                }), value: range?.checkOut ?? "", onChange: (v) => setDraft(patchConfigure(draft, {
                     dateRange: { checkIn: range?.checkIn ?? "", checkOut: v },
                 })), range: "future" })] }));
 }
 function CabinCategoryFields({ draft, setDraft, categories, }) {
-    return (_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Cabin category" }), _jsx("div", { className: "grid grid-cols-1 gap-2 sm:grid-cols-2", children: categories.map((cat) => {
+    const messages = useBookingsUiMessagesOrDefault();
+    return (_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: messages.bookingJourney.configure.cabinCategory }), _jsx("div", { className: "grid grid-cols-1 gap-2 sm:grid-cols-2", children: categories.map((cat) => {
                     const selected = draft.configure.cabinCategoryId === cat.id;
                     return (_jsxs("button", { type: "button", className: `rounded border p-3 text-left ${selected ? "border-primary ring-2 ring-primary" : ""}`, onClick: () => setDraft(patchConfigure(draft, { cabinCategoryId: cat.id, cabinNumberId: undefined })), children: [_jsx("div", { className: "font-medium", children: cat.name }), cat.description ? (_jsx("div", { className: "text-muted-foreground text-xs", children: cat.description })) : null] }, cat.id));
                 }) })] }));
 }
 function AirArrangementFields({ draft, setDraft, }) {
+    const messages = useBookingsUiMessagesOrDefault();
     const current = draft.configure.airArrangement;
     const options = [
         {
             value: "cruise_line",
-            label: "Cruise-line-arranged flights",
-            description: "The cruise line books your flights in a coordinated package. Operator follows up with the air desk.",
+            label: messages.bookingJourney.configure.airOptions.cruise_line.label,
+            description: messages.bookingJourney.configure.airOptions.cruise_line.description,
         },
         {
             value: "independent",
-            label: "Independent flights",
-            description: "Book flights yourself or via a separate flight booking line.",
+            label: messages.bookingJourney.configure.airOptions.independent.label,
+            description: messages.bookingJourney.configure.airOptions.independent.description,
         },
         {
             value: "none",
-            label: "No flights needed",
-            description: "Regional cruise / driving to the port.",
+            label: messages.bookingJourney.configure.airOptions.none.label,
+            description: messages.bookingJourney.configure.airOptions.none.description,
         },
     ];
-    return (_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Air arrangements" }), _jsx("div", { className: "grid grid-cols-1 gap-2 sm:grid-cols-3", children: options.map((opt) => {
+    return (_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: messages.bookingJourney.configure.airArrangements }), _jsx("div", { className: "grid grid-cols-1 gap-2 sm:grid-cols-3", children: options.map((opt) => {
                     const selected = current === opt.value;
                     return (_jsxs("button", { type: "button", className: `rounded border p-3 text-left text-sm ${selected ? "border-primary ring-2 ring-primary" : ""}`, onClick: () => setDraft(patchConfigure(draft, { airArrangement: opt.value })), children: [_jsx("div", { className: "font-medium", children: opt.label }), _jsx("div", { className: "text-muted-foreground text-xs", children: opt.description })] }, opt.value));
                 }) })] }));
 }
 function CabinNumberFields({ draft, setDraft, perCategory, }) {
+    const messages = useBookingsUiMessagesOrDefault();
     const catId = draft.configure.cabinCategoryId;
     if (!catId)
         return null;
     const cabins = perCategory[catId] ?? [];
-    return (_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Cabin number" }), _jsx("div", { className: "grid grid-cols-2 gap-2 sm:grid-cols-4", children: cabins.map((cabin) => {
+    return (_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: messages.bookingJourney.configure.cabinNumber }), _jsx("div", { className: "grid grid-cols-2 gap-2 sm:grid-cols-4", children: cabins.map((cabin) => {
                     const selected = draft.configure.cabinNumberId === cabin.id;
                     return (_jsx("button", { type: "button", className: `rounded border p-2 text-sm ${selected ? "border-primary ring-2 ring-primary" : ""}`, onClick: () => setDraft(patchConfigure(draft, { cabinNumberId: cabin.id })), children: cabin.label }, cabin.id));
                 }) })] }));
@@ -118,6 +135,7 @@ function CabinNumberFields({ draft, setDraft, perCategory, }) {
 // Billing
 // ─────────────────────────────────────────────────────────────────
 export function BillingStep({ draft, setDraft, renderLeadContactPicker, renderExtras, }) {
+    const messages = useBookingsUiMessagesOrDefault();
     const billing = draft.billing;
     const apply = (contact) => {
         setDraft(patchBilling(draft, {
@@ -129,11 +147,11 @@ export function BillingStep({ draft, setDraft, renderLeadContactPicker, renderEx
             },
         }));
     };
-    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: "Billing & lead contact" }) }), _jsxs(CardContent, { className: "space-y-6", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Buyer type" }), _jsxs(RadioGroup, { value: billing.buyerType, onValueChange: (v) => setDraft(patchBilling(draft, { buyerType: v })), className: "flex gap-4", children: [_jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx(RadioGroupItem, { value: "B2C" }), " Individual (B2C)"] }), _jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx(RadioGroupItem, { value: "B2B" }), " Company (B2B)"] })] })] }), renderLeadContactPicker ? _jsx("div", { children: renderLeadContactPicker({ apply }) }) : null, _jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(Field, { id: "bj-billing-firstName", label: "First name", value: billing.contact.firstName, onChange: (v) => setDraft(patchBilling(draft, { contact: { ...billing.contact, firstName: v } })) }), _jsx(Field, { id: "bj-billing-lastName", label: "Last name", value: billing.contact.lastName, onChange: (v) => setDraft(patchBilling(draft, { contact: { ...billing.contact, lastName: v } })) }), _jsx(Field, { id: "bj-billing-email", label: "Email", type: "email", value: billing.contact.email, onChange: (v) => setDraft(patchBilling(draft, { contact: { ...billing.contact, email: v } })) }), _jsx(PhoneField, { id: "bj-billing-phone", label: "Phone", value: billing.contact.phone ?? "", onChange: (v) => setDraft(patchBilling(draft, { contact: { ...billing.contact, phone: v } })) })] }), _jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(Field, { id: "bj-billing-line1", label: "Address line 1", value: billing.address.line1 ?? "", onChange: (v) => setDraft(patchBilling(draft, { address: { ...billing.address, line1: v } })) }), _jsx(Field, { id: "bj-billing-line2", label: "Address line 2 (optional)", value: billing.address.line2 ?? "", onChange: (v) => setDraft(patchBilling(draft, { address: { ...billing.address, line2: v } })) }), _jsx(Field, { id: "bj-billing-city", label: "City", value: billing.address.city ?? "", onChange: (v) => setDraft(patchBilling(draft, { address: { ...billing.address, city: v } })) }), _jsx(Field, { id: "bj-billing-postal", label: "Postal code", value: billing.address.postal ?? "", onChange: (v) => setDraft(patchBilling(draft, { address: { ...billing.address, postal: v } })) }), _jsxs("div", { className: "space-y-1 sm:col-span-2", children: [_jsx(Label, { htmlFor: "bj-billing-country", children: "Country" }), _jsx(CountryCombobox, { value: billing.address.country ?? null, onChange: (code) => setDraft(patchBilling(draft, {
+    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: messages.bookingJourney.billing.title }) }), _jsxs(CardContent, { className: "space-y-6", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: messages.bookingJourney.billing.buyerType }), _jsxs(RadioGroup, { value: billing.buyerType, onValueChange: (v) => setDraft(patchBilling(draft, { buyerType: v })), className: "flex gap-4", children: [_jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx(RadioGroupItem, { value: "B2C" }), " ", messages.bookingJourney.billing.individual] }), _jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx(RadioGroupItem, { value: "B2B" }), " ", messages.bookingJourney.billing.company] })] })] }), renderLeadContactPicker ? _jsx("div", { children: renderLeadContactPicker({ apply }) }) : null, _jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(Field, { id: "bj-billing-firstName", label: messages.bookingJourney.billing.firstName, value: billing.contact.firstName, onChange: (v) => setDraft(patchBilling(draft, { contact: { ...billing.contact, firstName: v } })) }), _jsx(Field, { id: "bj-billing-lastName", label: messages.bookingJourney.billing.lastName, value: billing.contact.lastName, onChange: (v) => setDraft(patchBilling(draft, { contact: { ...billing.contact, lastName: v } })) }), _jsx(Field, { id: "bj-billing-email", label: messages.bookingJourney.billing.email, type: "email", value: billing.contact.email, onChange: (v) => setDraft(patchBilling(draft, { contact: { ...billing.contact, email: v } })) }), _jsx(PhoneField, { id: "bj-billing-phone", label: messages.bookingJourney.billing.phone, value: billing.contact.phone ?? "", onChange: (v) => setDraft(patchBilling(draft, { contact: { ...billing.contact, phone: v } })) })] }), _jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(Field, { id: "bj-billing-line1", label: messages.bookingJourney.billing.addressLine1, value: billing.address.line1 ?? "", onChange: (v) => setDraft(patchBilling(draft, { address: { ...billing.address, line1: v } })) }), _jsx(Field, { id: "bj-billing-line2", label: messages.bookingJourney.billing.addressLine2Optional, value: billing.address.line2 ?? "", onChange: (v) => setDraft(patchBilling(draft, { address: { ...billing.address, line2: v } })) }), _jsx(Field, { id: "bj-billing-city", label: messages.bookingJourney.billing.city, value: billing.address.city ?? "", onChange: (v) => setDraft(patchBilling(draft, { address: { ...billing.address, city: v } })) }), _jsx(Field, { id: "bj-billing-postal", label: messages.bookingJourney.billing.postalCode, value: billing.address.postal ?? "", onChange: (v) => setDraft(patchBilling(draft, { address: { ...billing.address, postal: v } })) }), _jsxs("div", { className: "space-y-1 sm:col-span-2", children: [_jsx(Label, { htmlFor: "bj-billing-country", children: messages.bookingJourney.billing.country }), _jsx(CountryCombobox, { value: billing.address.country ?? null, onChange: (code) => setDraft(patchBilling(draft, {
                                             address: { ...billing.address, country: code ?? "" },
-                                        })) })] })] }), billing.buyerType === "B2B" ? (_jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(Field, { id: "bj-billing-companyName", label: "Company name", value: billing.company?.name ?? "", onChange: (v) => setDraft(patchBilling(draft, {
+                                        })) })] })] }), billing.buyerType === "B2B" ? (_jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(Field, { id: "bj-billing-companyName", label: messages.bookingJourney.billing.companyName, value: billing.company?.name ?? "", onChange: (v) => setDraft(patchBilling(draft, {
                                     company: { ...(billing.company ?? { name: "" }), name: v },
-                                })) }), _jsx(Field, { id: "bj-billing-vatId", label: "VAT id", value: billing.company?.vatId ?? "", onChange: (v) => setDraft(patchBilling(draft, {
+                                })) }), _jsx(Field, { id: "bj-billing-vatId", label: messages.bookingJourney.billing.vatId, value: billing.company?.vatId ?? "", onChange: (v) => setDraft(patchBilling(draft, {
                                     company: { ...(billing.company ?? { name: "" }), vatId: v },
                                 })) })] })) : null, renderExtras ? _jsx("div", { children: renderExtras() }) : null] })] }));
 }
@@ -141,6 +159,7 @@ export function BillingStep({ draft, setDraft, renderLeadContactPicker, renderEx
 // Travelers
 // ─────────────────────────────────────────────────────────────────
 export function TravelersStep({ draft, setDraft, shape, renderTravelerContactPicker, }) {
+    const messages = useBookingsUiMessagesOrDefault();
     const total = totalPax(draft);
     // Auto-resize the travelers list to match pax counts. Newly-added
     // rows pick a band based on the lowest-count band that's not yet
@@ -174,7 +193,7 @@ export function TravelersStep({ draft, setDraft, shape, renderTravelerContactPic
             return;
         setDraft(patchPaxCount(draft, defaultAddBand.code, current + 1));
     };
-    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: "Travelers" }) }), _jsxs(CardContent, { className: "space-y-4", children: [ensured.length === 0 ? (_jsx("p", { className: "text-muted-foreground text-sm", children: "Pick traveler counts in the Configure step to start adding details." })) : null, ensured.map((traveler, idx) => {
+    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: messages.bookingJourney.travelers.title }) }), _jsxs(CardContent, { className: "space-y-4", children: [ensured.length === 0 ? (_jsx("p", { className: "text-muted-foreground text-sm", children: messages.bookingJourney.travelers.empty })) : null, ensured.map((traveler, idx) => {
                         const apply = (contact) => {
                             const next = [...ensured];
                             next[idx] = {
@@ -190,7 +209,7 @@ export function TravelersStep({ draft, setDraft, shape, renderTravelerContactPic
                         const currentBandCount = draft.configure.pax?.[traveler.band] ?? 0;
                         const canRemove = !bandSpec || currentBandCount > bandSpec.minCount;
                         return (_jsx(TravelerCard, { idx: idx, traveler: traveler, shape: shape, draft: draft, setDraft: setDraft, renderTravelerContactPicker: renderTravelerContactPicker, apply: apply, onRemove: canRemove ? () => removeTraveler(idx) : undefined }, traveler.rowId ?? idx));
-                    }), canAddMore ? (_jsx("div", { className: "border-t pt-3", children: _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: addTraveler, children: "+ Add traveler" }) })) : null] })] }));
+                    }), canAddMore ? (_jsx("div", { className: "border-t pt-3", children: _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: addTraveler, children: messages.bookingJourney.travelers.addTraveler }) })) : null] })] }));
 }
 /**
  * One traveler block — name, optional contact, age, and any
@@ -204,6 +223,7 @@ export function TravelersStep({ draft, setDraft, shape, renderTravelerContactPic
  * touching the wizard.
  */
 function TravelerCard({ idx, traveler, shape, draft, setDraft, renderTravelerContactPicker, apply, onRemove, }) {
+    const messages = useBookingsUiMessagesOrDefault();
     // The band is bookkeeping — only show fields that apply to this
     // band per the descriptor, but never expose the band tag in the UI.
     // The user just sees a flat traveler list.
@@ -264,13 +284,24 @@ function TravelerCard({ idx, traveler, shape, draft, setDraft, renderTravelerCon
             phone: billingContact.phone || undefined,
         });
     };
-    return (_jsxs("div", { className: "rounded border p-4 space-y-3", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [_jsx("div", { className: "space-y-0.5", children: _jsxs("div", { className: "font-medium", children: ["Traveler ", idx + 1, computedAge != null ? (_jsxs("span", { className: "text-muted-foreground font-normal", children: [" \u00B7 age ", computedAge] })) : null] }) }), _jsxs("div", { className: "flex items-center gap-2", children: [canCopyFromBilling ? (_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: copyFromBilling, children: "Copy from billing" })) : null, renderTravelerContactPicker
+    return (_jsxs("div", { className: "rounded border p-4 space-y-3", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [_jsx("div", { className: "space-y-0.5", children: _jsxs("div", { className: "font-medium", children: [formatMessage(messages.bookingJourney.travelers.travelerNumber, {
+                                    number: idx + 1,
+                                }), computedAge != null ? (_jsxs("span", { className: "text-muted-foreground font-normal", children: [" ", "\u00B7", " ", formatMessage(messages.bookingJourney.travelers.ageLabel, {
+                                            age: computedAge,
+                                        })] })) : null] }) }), _jsxs("div", { className: "flex items-center gap-2", children: [canCopyFromBilling ? (_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: copyFromBilling, children: messages.bookingJourney.travelers.copyFromBilling })) : null, renderTravelerContactPicker
                                 ? renderTravelerContactPicker({ rowIndex: idx, apply })
-                                : null, onRemove ? (_jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "text-destructive hover:text-destructive", onClick: onRemove, children: "Remove" })) : null] })] }), _jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(Field, { id: `bj-trav-${idx}-first`, label: "First name", value: traveler.firstName, onChange: (v) => updateTraveler(draft, setDraft, idx, { firstName: v }) }), _jsx(Field, { id: `bj-trav-${idx}-last`, label: "Last name", value: traveler.lastName, onChange: (v) => updateTraveler(draft, setDraft, idx, { lastName: v }) }), applicableFields.some((f) => f.key === "email") ? (_jsx(Field, { id: `bj-trav-${idx}-email`, label: "Email", type: "email", value: traveler.email ?? "", onChange: (v) => updateTraveler(draft, setDraft, idx, { email: v }) })) : null, phoneField ? (_jsx(PhoneField, { id: `bj-trav-${idx}-phone`, label: phoneField.label + (phoneField.required ? " *" : ""), value: traveler.phone ?? "", onChange: (v) => updateTraveler(draft, setDraft, idx, { phone: v }) })) : null, dobField ? (_jsxs("div", { className: "space-y-1", children: [_jsx(DateField, { id: `bj-trav-${idx}-dob`, label: dobField.label + (dobField.required ? " *" : ""), value: traveler.dateOfBirth ?? "", onChange: onDobChange, range: "past" }), ageOutOfBounds ? (_jsxs("p", { className: "text-amber-600 text-xs dark:text-amber-400", children: ["\u26A0 Age ", computedAge, " is outside the accepted range for this product."] })) : null] })) : null, dynamicFields.map((field) => {
+                                : null, onRemove ? (_jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "text-destructive hover:text-destructive", onClick: onRemove, children: messages.bookingJourney.travelers.remove })) : null] })] }), _jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [_jsx(Field, { id: `bj-trav-${idx}-first`, label: messages.bookingJourney.billing.firstName, value: traveler.firstName, onChange: (v) => updateTraveler(draft, setDraft, idx, { firstName: v }) }), _jsx(Field, { id: `bj-trav-${idx}-last`, label: messages.bookingJourney.billing.lastName, value: traveler.lastName, onChange: (v) => updateTraveler(draft, setDraft, idx, { lastName: v }) }), applicableFields.some((f) => f.key === "email") ? (_jsx(Field, { id: `bj-trav-${idx}-email`, label: messages.bookingJourney.billing.email, type: "email", value: traveler.email ?? "", onChange: (v) => updateTraveler(draft, setDraft, idx, { email: v }) })) : null, phoneField ? (_jsx(PhoneField, { id: `bj-trav-${idx}-phone`, 
+                        // i18n-literal-ok Required marker appended to a descriptor-supplied field label.
+                        label: phoneField.label + (phoneField.required ? " *" : ""), value: traveler.phone ?? "", onChange: (v) => updateTraveler(draft, setDraft, idx, { phone: v }) })) : null, dobField ? (_jsxs("div", { className: "space-y-1", children: [_jsx(DateField, { id: `bj-trav-${idx}-dob`, 
+                                // i18n-literal-ok Required marker appended to a descriptor-supplied field label.
+                                label: dobField.label + (dobField.required ? " *" : ""), value: traveler.dateOfBirth ?? "", onChange: onDobChange, range: "past" }), ageOutOfBounds ? (_jsxs("p", { className: "text-amber-600 text-xs dark:text-amber-400", children: ["\u26A0", " ", formatMessage(messages.bookingJourney.validation.ageOutOfRange, {
+                                        age: computedAge,
+                                    })] })) : null] })) : null, dynamicFields.map((field) => {
                         const value = traveler.documents?.[field.key] ?? "";
                         const onFieldChange = (v) => updateTraveler(draft, setDraft, idx, {
                             documents: { ...traveler.documents, [field.key]: v },
                         });
+                        // i18n-literal-ok Required marker appended to a descriptor-supplied field label.
                         const labelText = field.label + (field.required ? " *" : "");
                         if (field.type === "select" && field.options) {
                             return (_jsx(SelectField, { id: `bj-trav-${idx}-${field.key}`, label: labelText, value: value, options: field.options, onChange: onFieldChange }, field.key));
@@ -347,10 +378,11 @@ function rebandTraveler(draft, idx, fromBand, toBand) {
 // Accommodation
 // ─────────────────────────────────────────────────────────────────
 export function AccommodationStep({ draft, setDraft, shape }) {
+    const messages = useBookingsUiMessagesOrDefault();
     const subSteps = shape.accommodation?.subSteps ?? [];
     const rooms = shape.accommodation?.roomOptions ?? [];
     const accommodation = draft.accommodation ?? { rooms: [], travelerAssignments: {} };
-    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: "Accommodation" }) }), _jsx(CardContent, { className: "space-y-4", children: rooms.length === 0 && subSteps.length === 0 ? (_jsx("p", { className: "text-muted-foreground text-sm", children: "No accommodation options for this product." })) : (_jsxs("div", { className: "space-y-3", children: [rooms.map((room) => {
+    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: messages.bookingJourney.accommodation.title }) }), _jsx(CardContent, { className: "space-y-4", children: rooms.length === 0 && subSteps.length === 0 ? (_jsx("p", { className: "text-muted-foreground text-sm", children: messages.bookingJourney.accommodation.empty })) : (_jsxs("div", { className: "space-y-3", children: [rooms.map((room) => {
                             const current = accommodation.rooms.find((r) => r.optionUnitId === room.id);
                             const ratePlans = room.ratePlans ?? [];
                             return (_jsxs("div", { className: "space-y-3 rounded border p-3", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { children: [_jsx("div", { className: "font-medium", children: room.name }), room.description ? (_jsx("div", { className: "text-muted-foreground text-xs", children: room.description })) : null] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", size: "sm", type: "button", onClick: () => {
@@ -377,26 +409,31 @@ export function AccommodationStep({ draft, setDraft, shape }) {
                                             const list = accommodation.rooms.map((r) => r.optionUnitId === room.id ? { ...r, ratePlanId: planId } : r);
                                             setDraft(setAccommodation(draft, { ...accommodation, rooms: list }));
                                         } })) : null] }, room.id));
-                        }), subSteps.map((sub) => sub.kind === "extensions" ? (_jsxs("div", { className: "rounded border p-3 text-muted-foreground text-sm", children: [sub.options.length, " extension option", sub.options.length === 1 ? "" : "s", " ", "available \u2014 UI lands in Phase F."] }, "extensions")) : null)] })) })] }));
+                        }), subSteps.map((sub) => sub.kind === "extensions" ? (_jsx("div", { className: "rounded border p-3 text-muted-foreground text-sm", children: formatMessage(messages.bookingJourney.accommodation.extensionsAvailable, {
+                                count: sub.options.length,
+                                plural: sub.options.length === 1 ? "" : "s",
+                            }) }, "extensions")) : null)] })) })] }));
 }
 function RatePlanPicker({ roomId, ratePlans, selected, onSelect, }) {
-    return (_jsxs("div", { className: "space-y-2 border-t pt-3", children: [_jsx(Label, { htmlFor: `bj-rate-plan-${roomId}`, children: "Rate plan" }), _jsx("div", { className: "space-y-2", children: ratePlans.map((plan) => {
+    const messages = useBookingsUiMessagesOrDefault();
+    return (_jsxs("div", { className: "space-y-2 border-t pt-3", children: [_jsx(Label, { htmlFor: `bj-rate-plan-${roomId}`, children: messages.bookingJourney.accommodation.ratePlan }), _jsx("div", { className: "space-y-2", children: ratePlans.map((plan) => {
                     const isSelected = plan.id === selected;
-                    return (_jsxs("button", { type: "button", onClick: () => onSelect(plan.id), className: `w-full rounded border p-2 text-left text-sm ${isSelected ? "border-primary ring-2 ring-primary" : ""}`, children: [_jsx("div", { className: "font-medium", children: plan.name }), plan.description ? (_jsx("div", { className: "text-muted-foreground text-xs", children: plan.description })) : null, plan.cancellationPolicy ? (_jsxs("div", { className: "text-muted-foreground text-xs", children: ["Cancellation: ", plan.cancellationPolicy] })) : null, plan.inclusions && plan.inclusions.length > 0 ? (_jsxs("div", { className: "text-muted-foreground text-xs", children: ["Includes: ", plan.inclusions.join(", ")] })) : null] }, plan.id));
+                    return (_jsxs("button", { type: "button", onClick: () => onSelect(plan.id), className: `w-full rounded border p-2 text-left text-sm ${isSelected ? "border-primary ring-2 ring-primary" : ""}`, children: [_jsx("div", { className: "font-medium", children: plan.name }), plan.description ? (_jsx("div", { className: "text-muted-foreground text-xs", children: plan.description })) : null, plan.cancellationPolicy ? (_jsxs("div", { className: "text-muted-foreground text-xs", children: [messages.bookingJourney.accommodation.cancellationPrefix, " ", plan.cancellationPolicy] })) : null, plan.inclusions && plan.inclusions.length > 0 ? (_jsxs("div", { className: "text-muted-foreground text-xs", children: [messages.bookingJourney.accommodation.includesPrefix, " ", plan.inclusions.join(", ")] })) : null] }, plan.id));
                 }) })] }));
 }
 // ─────────────────────────────────────────────────────────────────
 // Add-ons
 // ─────────────────────────────────────────────────────────────────
 export function AddonsStep({ draft, setDraft, shape }) {
+    const messages = useBookingsUiMessagesOrDefault();
     const flat = shape.addons?.catalog ?? [];
     const groups = shape.addons?.groups ?? [];
     const all = [...flat, ...groups.flatMap((g) => g.items)];
-    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: "Add-ons" }) }), _jsxs(CardContent, { className: "space-y-4", children: [all.length === 0 ? (_jsx("p", { className: "text-muted-foreground text-sm", children: "No add-ons available for this product." })) : null, groups.map((group) => {
+    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: messages.bookingJourney.addons.title }) }), _jsxs(CardContent, { className: "space-y-4", children: [all.length === 0 ? (_jsx("p", { className: "text-muted-foreground text-sm", children: messages.bookingJourney.addons.empty })) : null, groups.map((group) => {
                         // Group by port/day when the descriptor asks — cruise
                         // excursions arrive grouped by port name.
                         const buckets = group.groupBy === "port" || group.groupBy === "day"
-                            ? bucketBy(group.items, (i) => i.groupKey ?? "Other")
+                            ? bucketBy(group.items, (i) => i.groupKey ?? messages.bookingJourney.addons.otherBucket)
                             : new Map([["", group.items]]);
                         return (_jsxs("div", { className: "space-y-3", children: [_jsx("div", { className: "font-medium text-sm", children: group.label }), [...buckets.entries()].map(([bucket, items]) => (_jsxs("div", { className: "space-y-2", children: [bucket ? (_jsx("div", { className: "text-muted-foreground text-xs uppercase", children: bucket })) : null, items.map((item) => (_jsx(AddonRow, { draft: draft, setDraft: setDraft, item: item }, item.id)))] }, bucket || "all")))] }, group.label));
                     }), flat.length > 0 && groups.length === 0 ? (_jsx("div", { className: "space-y-2", children: flat.map((item) => (_jsx(AddonRow, { draft: draft, setDraft: setDraft, item: item }, item.id))) })) : null] })] }));
@@ -420,6 +457,7 @@ function AddonRow({ draft, setDraft, item, }) {
 // Payment
 // ─────────────────────────────────────────────────────────────────
 export function PaymentStep({ draft, setDraft, shape, capabilities, renderProviderStep, }) {
+    const messages = useBookingsUiMessagesOrDefault();
     // The descriptor lists what the *engine* supports; capabilities
     // narrow further to what the *deployment* turned on. Both must
     // accept an intent for the user to see it.
@@ -431,8 +469,8 @@ export function PaymentStep({ draft, setDraft, shape, capabilities, renderProvid
     if (allowed.length > 0 && !allowed.includes(intent)) {
         setDraft(setPayment(draft, { ...draft.payment, intent: allowed[0] }));
     }
-    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: "Payment" }) }), _jsxs(CardContent, { className: "space-y-4", children: [allowed.length === 0 ? (_jsx("p", { className: "text-muted-foreground text-sm", children: "No payment methods are available for this booking." })) : (_jsx(RadioGroup, { value: intent, onValueChange: (v) => setDraft(setPayment(draft, { ...draft.payment, intent: v })), className: "grid grid-cols-1 gap-2", children: allowed.map((i) => {
-                            const meta = intentMeta(i);
+    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: messages.bookingJourney.payment.title }) }), _jsxs(CardContent, { className: "space-y-4", children: [allowed.length === 0 ? (_jsx("p", { className: "text-muted-foreground text-sm", children: messages.bookingJourney.payment.empty })) : (_jsx(RadioGroup, { value: intent, onValueChange: (v) => setDraft(setPayment(draft, { ...draft.payment, intent: v })), className: "grid grid-cols-1 gap-2", children: allowed.map((i) => {
+                            const meta = intentMeta(i, messages);
                             const selected = i === intent;
                             return (_jsxs("label", { className: "flex cursor-pointer items-start gap-3 rounded border p-3 text-sm transition-colors " +
                                     (selected ? "border-primary bg-primary/5" : "border-input hover:bg-muted/50"), children: [_jsx(RadioGroupItem, { value: i, className: "mt-0.5" }), _jsxs("div", { className: "space-y-0.5", children: [_jsx("div", { className: "font-medium", children: meta.label }), _jsx("div", { className: "text-muted-foreground text-xs", children: meta.description })] })] }, i));
@@ -440,13 +478,14 @@ export function PaymentStep({ draft, setDraft, shape, capabilities, renderProvid
                             intent,
                             schedule: draft.payment.schedule,
                             capabilities,
-                        }) })) : (_jsx("p", { className: "text-muted-foreground text-sm", children: "You'll be redirected to our secure payment page after confirming the booking." }))) : null, intent === "bank_transfer" ? _jsx(BankTransferDetails, { capabilities: capabilities }) : null, intent === "inquiry" ? (_jsx("p", { className: "rounded border border-amber-300 bg-amber-50 p-3 text-amber-900 text-xs dark:border-amber-700 dark:bg-amber-950 dark:text-amber-100", children: "We'll send your details to the operator without locking inventory or taking payment. They'll get back to you with availability and a quote \u2014 typically within one business day." })) : null] })] }));
+                        }) })) : (_jsx("p", { className: "text-muted-foreground text-sm", children: messages.bookingJourney.payment.redirectedAfterConfirm }))) : null, intent === "bank_transfer" ? _jsx(BankTransferDetails, { capabilities: capabilities }) : null, intent === "inquiry" ? (_jsx("p", { className: "rounded border border-amber-300 bg-amber-50 p-3 text-amber-900 text-xs dark:border-amber-700 dark:bg-amber-950 dark:text-amber-100", children: messages.bookingJourney.payment.inquiryNotice })) : null] })] }));
 }
 function BankTransferDetails({ capabilities, }) {
+    const messages = useBookingsUiMessagesOrDefault();
     const note = capabilities.config?.bankTransferNote;
-    return (_jsxs("div", { className: "rounded border bg-muted/30 p-3 text-sm", children: [_jsx("p", { className: "font-medium", children: "Bank transfer instructions" }), _jsx("p", { className: "text-muted-foreground text-xs", children: typeof note === "string" && note.length > 0
+    return (_jsxs("div", { className: "rounded border bg-muted/30 p-3 text-sm", children: [_jsx("p", { className: "font-medium", children: messages.bookingJourney.payment.bankTransferInstructions }), _jsx("p", { className: "text-muted-foreground text-xs", children: typeof note === "string" && note.length > 0
                     ? note
-                    : "After you submit, you'll receive an email with our bank details and a payment reference. Inventory is held pending payment." })] }));
+                    : messages.bookingJourney.payment.bankTransferDefaultNote })] }));
 }
 function isCapabilityEnabled(intent, capabilities) {
     switch (intent) {
@@ -462,41 +501,19 @@ function isCapabilityEnabled(intent, capabilities) {
             return capabilities.acceptsInquiry === true;
     }
 }
-function intentMeta(intent) {
-    switch (intent) {
-        case "card":
-            return {
-                label: "Pay by card",
-                description: "Charged immediately. Inventory is reserved on confirmation.",
-            };
-        case "bank_transfer":
-            return {
-                label: "Bank transfer",
-                description: "We'll send you bank details and a reference. Inventory is held while we wait for the transfer.",
-            };
-        case "hold":
-            return {
-                label: "Hold for now",
-                description: "Reserve inventory without paying. The operator follows up to collect payment.",
-            };
-        case "ticket_on_credit":
-            return {
-                label: "Agency credit account",
-                description: "Charge against an agency's credit line. Operator surfaces only.",
-            };
-        case "inquiry":
-            return {
-                label: "Send as inquiry",
-                description: "No payment, no inventory hold. The operator gets back to you with availability and a quote.",
-            };
-    }
+function intentMeta(intent, messages) {
+    return {
+        label: messages.bookingJourney.payment.intentLabels[intent],
+        description: messages.bookingJourney.payment.intentDescriptions[intent],
+    };
 }
 // ─────────────────────────────────────────────────────────────────
 // Review
 // ─────────────────────────────────────────────────────────────────
 export function ReviewStep({ draft, setDraft, isCommitting, onConfirm, renderExtras, surface, }) {
+    const messages = useBookingsUiMessagesOrDefault();
     const isPublic = surface === "public";
-    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: "Review & confirm" }) }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { children: [_jsx("div", { className: "font-medium", children: "Lead contact" }), _jsxs("div", { className: "text-muted-foreground text-sm", children: [draft.billing.contact.firstName, " ", draft.billing.contact.lastName, " \u2014", " ", draft.billing.contact.email] })] }), _jsxs("div", { children: [_jsx("div", { className: "font-medium", children: "Travelers" }), _jsx("ul", { className: "text-muted-foreground text-sm", children: draft.travelers.map((t, i) => (_jsxs("li", { children: [t.firstName, " ", t.lastName, " (", t.band, ")"] }, t.rowId ?? i))) })] }), isPublic ? (_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { htmlFor: "bj-customer-notes", children: "Notes" }), _jsx(Textarea, { id: "bj-customer-notes", placeholder: "Anything we should know? (allergies, accessibility needs, special occasion\u2026)", value: draft.customerNotes ?? "", onChange: (e) => setDraft({ ...draft, customerNotes: e.target.value }) })] })) : (_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { htmlFor: "bj-internal-notes", children: "Internal notes (operator-only)" }), _jsx(Textarea, { id: "bj-internal-notes", value: draft.internalNotes ?? "", onChange: (e) => setDraft({ ...draft, internalNotes: e.target.value }) })] })), renderExtras ? _jsx("div", { children: renderExtras() }) : null, _jsx(Button, { onClick: onConfirm, disabled: isCommitting, children: isCommitting ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Confirming\u2026"] })) : ("Confirm booking") })] })] }));
+    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: messages.bookingJourney.review.title }) }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { children: [_jsx("div", { className: "font-medium", children: messages.bookingJourney.review.leadContact }), _jsxs("div", { className: "text-muted-foreground text-sm", children: [draft.billing.contact.firstName, " ", draft.billing.contact.lastName, " \u00B7", " ", draft.billing.contact.email] })] }), _jsxs("div", { children: [_jsx("div", { className: "font-medium", children: messages.bookingJourney.review.travelers }), _jsx("ul", { className: "text-muted-foreground text-sm", children: draft.travelers.map((t, i) => (_jsxs("li", { children: [t.firstName, " ", t.lastName, " (", t.band, ")"] }, t.rowId ?? i))) })] }), isPublic ? (_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { htmlFor: "bj-customer-notes", children: messages.bookingJourney.review.customerNotes }), _jsx(Textarea, { id: "bj-customer-notes", placeholder: messages.bookingJourney.review.customerNotesPlaceholder, value: draft.customerNotes ?? "", onChange: (e) => setDraft({ ...draft, customerNotes: e.target.value }) })] })) : (_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { htmlFor: "bj-internal-notes", children: messages.bookingJourney.review.internalNotes }), _jsx(Textarea, { id: "bj-internal-notes", value: draft.internalNotes ?? "", onChange: (e) => setDraft({ ...draft, internalNotes: e.target.value }) })] })), renderExtras ? _jsx("div", { children: renderExtras() }) : null, _jsx(Button, { onClick: onConfirm, disabled: isCommitting, children: isCommitting ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), messages.bookingJourney.review.confirming] })) : (messages.bookingJourney.review.confirmBooking) })] })] }));
 }
 // ─────────────────────────────────────────────────────────────────
 // Helpers
@@ -534,7 +551,8 @@ function DateField({ id, label, value, onChange, range = "future", }) {
     return (_jsxs("div", { className: "space-y-1", id: id, children: [_jsx(Label, { children: label }), _jsx(DatePicker, { value: value || null, onChange: (v) => onChange(v ?? ""), captionLayout: "dropdown", startMonth: startMonth, endMonth: endMonth, defaultMonth: defaultMonth, displayFormat: "PPP" })] }));
 }
 function SelectField({ id, label, value, options, onChange, }) {
-    return (_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { htmlFor: id, children: label }), _jsxs("select", { id: id, className: "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50", value: value, onChange: (e) => onChange(e.target.value), children: [_jsx("option", { value: "", children: "Select\u2026" }), options.map((opt) => (_jsx("option", { value: opt.value, children: opt.label }, opt.value)))] })] }));
+    const messages = useBookingsUiMessagesOrDefault();
+    return (_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { htmlFor: id, children: label }), _jsxs("select", { id: id, className: "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50", value: value, onChange: (e) => onChange(e.target.value), children: [_jsx("option", { value: "", children: messages.bookingJourney.values.selectPlaceholder }), options.map((opt) => (_jsx("option", { value: opt.value, children: opt.label }, opt.value)))] })] }));
 }
 /**
  * Years between an ISO date-of-birth and today. Returns `null` for
@@ -552,15 +570,19 @@ function computeAge(dob) {
         age -= 1;
     return age >= 0 ? age : null;
 }
-function ageHint(min, max) {
-    if (min != null && max != null)
-        return `${min}–${max}y`;
-    if (min != null)
-        return `${min}y+`;
-    if (max != null)
-        return `up to ${max}y`;
+function ageHint(min, max, messages) {
+    if (min != null && max != null) {
+        return formatMessage(messages.bookingJourney.configure.ageHintRange, { min, max });
+    }
+    if (min != null) {
+        return formatMessage(messages.bookingJourney.configure.ageHintMinimum, { min });
+    }
+    if (max != null) {
+        return formatMessage(messages.bookingJourney.configure.ageHintMaximum, { max });
+    }
     return "";
 }
+// i18n-literal-ok Generic helper type signature, not user-visible copy.
 function bucketBy(items, keyFn) {
     const map = new Map();
     for (const item of items) {

package/dist/journey/components/side-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"side-panel.d.ts","sourceRoot":"","sources":["../../../src/journey/components/side-panel.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAqC,cAAc,EAAE,MAAM,aAAa,CAAA;AAEpF;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,SAAS,EACT,aAAa,EACb,aAAa,EACb,WAAW,EACX,KAAK,EACL,KAAK,EACL,SAAS,GACV,EAAE,cAAc,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,KAAK,CAAC,YAAY,CAsD9D"}
+{"version":3,"file":"side-panel.d.ts","sourceRoot":"","sources":["../../../src/journey/components/side-panel.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAqC,cAAc,EAAE,MAAM,aAAa,CAAA;AAEpF;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,SAAS,EACT,aAAa,EACb,aAAa,EACb,WAAW,EACX,KAAK,EACL,KAAK,EACL,SAAS,GACV,EAAE,cAAc,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,KAAK,CAAC,YAAY,CAuD9D"}