@voyantjs/flights-ui 0.20.0

package/dist/components/flight-fare-upsell-step.js

@@ -0,0 +1,141 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Checkbox } from "@voyantjs/ui/components/checkbox";
+import { cn } from "@voyantjs/ui/lib/utils";
+import { Briefcase, Check, Crown, Luggage, Sparkles, X } from "lucide-react";
+import { useMemo } from "react";
+/**
+ * Per-pax per-leg branded-fare upsell step. For multi-pax bookings the
+ * "Same fare for all passengers" toggle (default ON) collapses the picker
+ * back to one card grid per leg, keeping the common case ("everyone on
+ * Standard") to one click. Toggling off splits each leg into per-pax card
+ * grids — useful for the "Adult 1 Plus, Adult 2 Basic" case full-service
+ * carriers + B2B agency bookings actually exercise.
+ */
+export function FlightFareUpsellStep({ outboundOffer, returnOffer, passengers, passengerCounts, value, onChange, sameForAllPassengers, onSameForAllPassengersChange, }) {
+    const paxRows = useMemo(() => buildPassengerRows(passengers, passengerCounts), [passengers, passengerCounts]);
+    const isMultiPax = paxRows.length > 1;
+    const outboundBundles = outboundOffer.fareBundles ?? [];
+    const returnBundles = returnOffer?.fareBundles ?? [];
+    if (outboundBundles.length === 0 && returnBundles.length === 0) {
+        return (_jsx("div", { className: "rounded-xl border border-dashed p-6 text-center text-muted-foreground text-sm", children: "This offer doesn't surface fare upgrade tiers." }));
+    }
+    const setPick = (passengerId, sliceIndex, bundleId) => {
+        const filtered = value.filter((p) => !(p.passengerId === passengerId && p.sliceIndex === sliceIndex));
+        if (bundleId) {
+            onChange([...filtered, { passengerId, sliceIndex, bundleId }]);
+        }
+        else {
+            onChange(filtered);
+        }
+    };
+    /**
+     * "Same fare for all" handler — picks on behalf of every passenger on the
+     * given leg. A null bundleId clears all picks for that leg.
+     */
+    const setLegPick = (sliceIndex, bundleId) => {
+        const filtered = value.filter((p) => p.sliceIndex !== sliceIndex);
+        if (!bundleId) {
+            onChange(filtered);
+            return;
+        }
+        const additions = paxRows.map((p) => ({
+            passengerId: p.passengerId,
+            sliceIndex,
+            bundleId,
+        }));
+        onChange([...filtered, ...additions]);
+    };
+    return (_jsxs("div", { className: "flex flex-col gap-5", children: [_jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { children: [_jsx("h2", { className: "font-semibold text-base", children: "Upgrade your fare" }), _jsx("p", { className: "text-muted-foreground text-sm", children: "Add bag, seat picks, and flexibility per leg \u2014 or keep the base fare." })] }), isMultiPax && (_jsxs("div", { className: "flex shrink-0 items-center gap-2 text-sm", children: [_jsx(Checkbox, { id: "fare-same-for-all", checked: sameForAllPassengers, onCheckedChange: (v) => onSameForAllPassengersChange(!!v) }), _jsx("label", { htmlFor: "fare-same-for-all", className: "cursor-pointer", children: "Same fare for all passengers" })] }))] }), _jsx(FareLegSection, { label: "Outbound", bundles: outboundBundles, sliceIndex: 0, paxRows: paxRows, value: value, sameForAll: sameForAllPassengers || !isMultiPax, onSetPick: setPick, onSetLegPick: setLegPick }), returnOffer && returnBundles.length > 0 && (_jsx(FareLegSection, { label: "Return", bundles: returnBundles, sliceIndex: 1, paxRows: paxRows, value: value, sameForAll: sameForAllPassengers || !isMultiPax, onSetPick: setPick, onSetLegPick: setLegPick }))] }));
+}
+function FareLegSection({ label, bundles, sliceIndex, paxRows, value, sameForAll, onSetPick, onSetLegPick, }) {
+    // For "same for all" mode we treat the leg as having one selection — the
+    // bundleId common to every pax pick on this leg (null when split or none).
+    const legPick = (() => {
+        if (paxRows.length === 0)
+            return null;
+        const ids = paxRows.map((p) => value.find((v) => v.passengerId === p.passengerId && v.sliceIndex === sliceIndex)
+            ?.bundleId ?? null);
+        if (ids.every((id) => id === ids[0]))
+            return ids[0] ?? null;
+        return null;
+    })();
+    const someoneSelected = value.some((v) => v.sliceIndex === sliceIndex);
+    return (_jsxs("section", { className: "flex flex-col gap-3", children: [_jsxs("header", { className: "flex items-baseline justify-between gap-2", children: [_jsx("h3", { className: "font-medium text-[11px] uppercase tracking-wider text-muted-foreground", children: label }), someoneSelected && (_jsx("button", { type: "button", onClick: () => onSetLegPick(sliceIndex, null), className: "text-muted-foreground text-xs hover:text-foreground", children: "Reset to Basic" }))] }), sameForAll ? (_jsx(BundleGrid, { bundles: bundles, selectedId: legPick, contextLabel: paxRows.length > 1 ? `Applies to all ${paxRows.length} passengers` : null, onPick: (id) => onSetLegPick(sliceIndex, id) })) : (_jsx("div", { className: "flex flex-col gap-4", children: paxRows.map((pax) => {
+                    const pick = value.find((v) => v.passengerId === pax.passengerId && v.sliceIndex === sliceIndex);
+                    return (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("span", { className: "font-medium text-sm", children: pax.label }), _jsx(BundleGrid, { bundles: bundles, selectedId: pick?.bundleId ?? null, onPick: (id) => onSetPick(pax.passengerId, sliceIndex, id) })] }, pax.passengerId));
+                }) }))] }));
+}
+function BundleGrid({ bundles, selectedId, contextLabel, onPick, }) {
+    return (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("div", { className: "grid gap-3 md:grid-cols-3", children: bundles.map((b) => (_jsx(BundleCard, { bundle: b, selected: selectedId === b.id, isBasicByDefault: selectedId == null && b.tier === "basic", onPick: () => onPick(b.tier === "basic" ? null : b.id) }, b.id))) }), contextLabel && _jsx("span", { className: "text-[11px] text-muted-foreground", children: contextLabel })] }));
+}
+function BundleCard({ bundle, selected, isBasicByDefault, onPick, }) {
+    const delta = Number(bundle.priceDelta.amount);
+    const deltaLabel = delta > 0 ? `+${formatMoney(bundle.priceDelta.amount, bundle.priceDelta.currency)}` : "Included";
+    const showActiveRing = selected || isBasicByDefault;
+    return (_jsxs("button", { type: "button", onClick: onPick, className: cn("relative flex flex-col gap-3 rounded-lg border bg-card p-4 text-left transition-colors", showActiveRing
+            ? "border-primary ring-2 ring-primary/20"
+            : "hover:border-primary/40 hover:bg-accent/30", bundle.recommended && !showActiveRing && "border-primary/40"), children: [bundle.recommended && (_jsx("span", { className: "-translate-y-1/2 absolute top-0 left-4 rounded-full bg-primary px-2 py-0.5 font-medium text-[9px] text-primary-foreground uppercase tracking-wider", children: "Recommended" })), _jsxs("div", { className: "flex items-baseline justify-between gap-2", children: [_jsxs("span", { className: "flex items-center gap-1.5 font-semibold text-sm", children: [_jsx(TierIcon, { tier: bundle.tier }), bundle.label] }), _jsx("span", { className: cn("font-medium text-xs", delta > 0 ? "text-foreground" : "text-emerald-600"), children: deltaLabel })] }), _jsxs("ul", { className: "flex flex-col gap-1.5", children: [_jsx(Inclusion, { ok: !!bundle.inclusions.cabinBag?.included, icon: _jsx(Briefcase, { className: "h-3.5 w-3.5" }), label: bundle.inclusions.cabinBag?.included
+                            ? `Cabin bag ${bundle.inclusions.cabinBag.weightKg ? `(${bundle.inclusions.cabinBag.weightKg} kg)` : ""}`.trim()
+                            : "No cabin bag" }), _jsx(Inclusion, { ok: !!bundle.inclusions.checkedBag?.included, icon: _jsx(Luggage, { className: "h-3.5 w-3.5" }), label: bundle.inclusions.checkedBag?.included
+                            ? `Checked bag ${bundle.inclusions.checkedBag.weightKg
+                                ? `${bundle.inclusions.checkedBag.weightKg} kg`
+                                : ""}${bundle.inclusions.checkedBag.pieces && bundle.inclusions.checkedBag.pieces > 1
+                                ? ` × ${bundle.inclusions.checkedBag.pieces}`
+                                : ""}`.trim()
+                            : "No checked bag" }), _jsx(Inclusion, { ok: bundle.inclusions.seatSelection !== "none" && bundle.inclusions.seatSelection != null, icon: _jsx(Sparkles, { className: "h-3.5 w-3.5" }), label: bundle.inclusions.seatSelection === "free"
+                            ? "Free seat selection"
+                            : bundle.inclusions.seatSelection === "standard"
+                                ? "Standard seat selection"
+                                : "No seat selection" }), _jsx(Inclusion, { ok: !!bundle.inclusions.priorityBoarding, label: "Priority boarding" }), _jsx(Inclusion, { ok: !!bundle.inclusions.loungeAccess, label: "Lounge access" }), _jsx(Inclusion, { ok: !!bundle.inclusions.changeable, label: bundle.inclusions.changeable ? "Free changes" : "Changes for a fee" }), _jsx(Inclusion, { ok: !!bundle.inclusions.refundable, label: bundle.inclusions.refundable ? "Refundable" : "Non-refundable" }), bundle.inclusions.notes?.map((n) => (_jsx(Inclusion, { ok: true, label: n }, n)))] }), selected && (_jsxs("span", { className: "mt-1 inline-flex items-center gap-1 self-start font-medium text-primary text-xs", children: [_jsx(Check, { className: "h-3 w-3" }), " Selected"] }))] }));
+}
+function Inclusion({ ok, icon, label }) {
+    return (_jsxs("li", { className: "flex items-center gap-2 text-xs", children: [ok ? (_jsx(Check, { className: "h-3.5 w-3.5 shrink-0 text-emerald-600" })) : (_jsx(X, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground/60" })), _jsxs("span", { className: "flex items-center gap-1.5 text-foreground", children: [icon, _jsx("span", { className: cn(!ok && "text-muted-foreground"), children: label })] })] }));
+}
+function TierIcon({ tier }) {
+    switch (tier) {
+        case "plus":
+        case "premium":
+            return _jsx(Crown, { className: "h-3.5 w-3.5 text-amber-500" });
+        case "standard":
+            return _jsx(Sparkles, { className: "h-3.5 w-3.5 text-primary" });
+        default:
+            return _jsx(Briefcase, { className: "h-3.5 w-3.5 text-muted-foreground" });
+    }
+}
+function buildPassengerRows(passengers, counts) {
+    if (passengers.length > 0) {
+        return passengers.map((p, idx) => ({
+            passengerId: p.passengerId,
+            label: nameOrFallback(p, idx),
+        }));
+    }
+    const out = [];
+    for (let i = 1; i <= counts.adults; i++) {
+        out.push({ passengerId: `pax_adult_${i}`, label: `Adult ${i}` });
+    }
+    for (let i = 1; i <= (counts.children ?? 0); i++) {
+        out.push({ passengerId: `pax_child_${i}`, label: `Child ${i}` });
+    }
+    for (let i = 1; i <= (counts.infants ?? 0); i++) {
+        out.push({ passengerId: `pax_infant_${i}`, label: `Infant ${i}` });
+    }
+    return out;
+}
+function nameOrFallback(p, idx) {
+    const full = `${p.firstName} ${p.lastName}`.trim();
+    if (full)
+        return full;
+    const cap = p.type[0]?.toUpperCase() + p.type.slice(1);
+    return `${cap} ${idx + 1}`;
+}
+function formatMoney(amount, currency) {
+    const n = Number(amount);
+    if (!Number.isFinite(n))
+        return `${amount} ${currency}`;
+    return new Intl.NumberFormat(undefined, {
+        style: "currency",
+        currency,
+        maximumFractionDigits: 0,
+    }).format(n);
+}

package/dist/components/flight-filters-bar.d.ts

@@ -0,0 +1,19 @@
+import type { FlightOffer } from "@voyantjs/flights/contract/types";
+export interface FlightFiltersValue {
+    /** Selected carrier IATA codes (empty = no carrier filter). */
+    carriers: string[];
+    /** Max stops on any single itinerary. `null` = no cap. */
+    maxStops: number | null;
+    /** Inclusive price ceiling (in offer's currency). `null` = no cap. */
+    maxPrice: number | null;
+}
+export declare const EMPTY_FLIGHT_FILTERS: FlightFiltersValue;
+export interface FlightFiltersBarProps {
+    value: FlightFiltersValue;
+    onChange: (next: FlightFiltersValue) => void;
+    /** Live offer set — used to derive carrier facet buckets and the price/stops range. */
+    offers: FlightOffer[];
+    carrierName?: (iataCode: string) => string | undefined;
+}
+export declare function FlightFiltersBar({ value, onChange, offers, carrierName }: FlightFiltersBarProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=flight-filters-bar.d.ts.map

package/dist/components/flight-filters-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"flight-filters-bar.d.ts","sourceRoot":"","sources":["../../src/components/flight-filters-bar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAmBnE,MAAM,WAAW,kBAAkB;IACjC,+DAA+D;IAC/D,QAAQ,EAAE,MAAM,EAAE,CAAA;IAClB,0DAA0D;IAC1D,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAA;IACvB,sEAAsE;IACtE,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAA;CACxB;AAED,eAAO,MAAM,oBAAoB,EAAE,kBAIlC,CAAA;AAED,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,kBAAkB,CAAA;IACzB,QAAQ,EAAE,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAA;IAC5C,uFAAuF;IACvF,MAAM,EAAE,WAAW,EAAE,CAAA;IACrB,WAAW,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;CACvD;AAED,wBAAgB,gBAAgB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,EAAE,EAAE,qBAAqB,2CA+C/F"}

package/dist/components/flight-filters-bar.js

@@ -0,0 +1,90 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Button } from "@voyantjs/ui/components/button";
+import { Checkbox } from "@voyantjs/ui/components/checkbox";
+import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, } from "@voyantjs/ui/components/command";
+import { Input } from "@voyantjs/ui/components/input";
+import { Popover, PopoverContent, PopoverTrigger } from "@voyantjs/ui/components/popover";
+import { PlusCircle, X } from "lucide-react";
+import { AirlineLogo } from "./airline-logo";
+export const EMPTY_FLIGHT_FILTERS = {
+    carriers: [],
+    maxStops: null,
+    maxPrice: null,
+};
+export function FlightFiltersBar({ value, onChange, offers, carrierName }) {
+    const carrierBuckets = deriveCarrierBuckets(offers);
+    const stopsBuckets = deriveStopsBuckets(offers);
+    const hasSelections = value.carriers.length > 0 || value.maxStops != null || value.maxPrice != null;
+    return (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(CarrierFilter, { buckets: carrierBuckets, selected: value.carriers, carrierName: carrierName, onToggle: (code) => onChange({
+                    ...value,
+                    carriers: value.carriers.includes(code)
+                        ? value.carriers.filter((c) => c !== code)
+                        : [...value.carriers, code],
+                }), onClear: () => onChange({ ...value, carriers: [] }) }), _jsx(StopsFilter, { buckets: stopsBuckets, selected: value.maxStops, onSelect: (maxStops) => onChange({ ...value, maxStops }) }), _jsx(PriceFilter, { value: value.maxPrice, onChange: (maxPrice) => onChange({ ...value, maxPrice }) }), hasSelections && (_jsxs(Button, { variant: "ghost", size: "sm", className: "h-8 px-2 text-muted-foreground hover:text-foreground", onClick: () => onChange(EMPTY_FLIGHT_FILTERS), children: [_jsx(X, { className: "mr-1 h-3.5 w-3.5" }), "Clear all"] }))] }));
+}
+/**
+ * Shared inline trigger contents for the three filter popovers. Renders
+ * inside `<PopoverTrigger render={<Button .../>}>` as the button's
+ * children — base-ui merges its onClick / aria-expanded onto the Button
+ * directly. (Wrapping these in a separate component breaks the click flow
+ * because base-ui's prop-merge can't see through a custom wrapper.)
+ */
+function TriggerContents({ label, count, preview, }) {
+    return (_jsxs(_Fragment, { children: [_jsx(PlusCircle, { className: "h-3.5 w-3.5" }), _jsx("span", { children: label }), preview, count != null && count > 0 && (_jsx("span", { className: "-mr-0.5 inline-flex h-5 min-w-5 items-center justify-center rounded-full bg-primary px-1.5 text-[11px] font-medium tabular-nums text-primary-foreground", children: count }))] }));
+}
+const TRIGGER_CLASS = "h-8 gap-2 border-dashed";
+function CarrierFilter({ buckets, selected, carrierName, onToggle, onClear, }) {
+    if (buckets.length === 0)
+        return null;
+    const selectedSet = new Set(selected);
+    return (_jsxs(Popover, { children: [_jsx(PopoverTrigger, { render: _jsx(Button, { variant: "outline", size: "sm", className: TRIGGER_CLASS }), children: _jsx(TriggerContents, { label: "Airlines", count: selected.length }) }), _jsx(PopoverContent, { className: "w-[260px] p-0", align: "start", children: _jsxs(Command, { children: [_jsx(CommandInput, { placeholder: "Filter airlines\u2026" }), _jsxs(CommandList, { children: [_jsx(CommandEmpty, { children: "No airlines." }), _jsx(CommandGroup, { children: buckets.map((b) => {
+                                        const isSelected = selectedSet.has(b.iataCode);
+                                        return (_jsxs(CommandItem, { onSelect: () => onToggle(b.iataCode), children: [_jsx(Checkbox, { checked: isSelected, tabIndex: -1, "aria-hidden": true, className: "mr-2 pointer-events-none" }), _jsx(AirlineLogo, { iataCode: b.iataCode, name: carrierName?.(b.iataCode), size: 20, className: "mr-2" }), _jsx("span", { className: "flex-1 truncate", children: carrierName?.(b.iataCode) ?? b.iataCode }), _jsx("span", { className: "ml-2 text-xs text-muted-foreground", children: b.count })] }, b.iataCode));
+                                    }) }), selected.length > 0 && (_jsxs(_Fragment, { children: [_jsx(CommandSeparator, {}), _jsx(CommandGroup, { children: _jsx(CommandItem, { onSelect: onClear, className: "justify-center text-center text-muted-foreground", children: "Clear filter" }) })] }))] })] }) })] }));
+}
+function deriveCarrierBuckets(offers) {
+    const counts = new Map();
+    for (const offer of offers) {
+        const carriers = new Set();
+        for (const itin of offer.itineraries) {
+            for (const seg of itin.segments) {
+                carriers.add(seg.carrierCode);
+            }
+        }
+        for (const c of carriers)
+            counts.set(c, (counts.get(c) ?? 0) + 1);
+    }
+    return Array.from(counts.entries())
+        .map(([iataCode, count]) => ({ iataCode, count }))
+        .sort((a, b) => b.count - a.count);
+}
+function StopsFilter({ buckets, selected, onSelect, }) {
+    if (buckets.length === 0)
+        return null;
+    const preview = selected != null ? (_jsx("span", { className: "text-muted-foreground", children: selected === 0 ? "· Nonstop" : `· ≤ ${selected}` })) : null;
+    return (_jsxs(Popover, { children: [_jsx(PopoverTrigger, { render: _jsx(Button, { variant: "outline", size: "sm", className: TRIGGER_CLASS }), children: _jsx(TriggerContents, { label: "Stops", preview: preview }) }), _jsx(PopoverContent, { className: "w-[200px] p-0", align: "start", children: _jsx(Command, { children: _jsxs(CommandList, { children: [_jsx(CommandGroup, { children: buckets.map((b) => {
+                                    const isSelected = selected === b.stops;
+                                    return (_jsxs(CommandItem, { onSelect: () => onSelect(b.stops), children: [_jsx(Checkbox, { checked: isSelected, tabIndex: -1, "aria-hidden": true, className: "mr-2 pointer-events-none" }), _jsx("span", { className: "flex-1", children: b.stops === 0 ? "Nonstop" : `Up to ${b.stops} stop${b.stops > 1 ? "s" : ""}` }), _jsx("span", { className: "ml-2 text-xs text-muted-foreground", children: b.count })] }, b.stops));
+                                }) }), selected != null && (_jsxs(_Fragment, { children: [_jsx(CommandSeparator, {}), _jsx(CommandGroup, { children: _jsx(CommandItem, { onSelect: () => onSelect(null), className: "justify-center text-center text-muted-foreground", children: "Clear filter" }) })] }))] }) }) })] }));
+}
+function deriveStopsBuckets(offers) {
+    const counts = new Map();
+    for (const offer of offers) {
+        const maxStops = Math.max(0, ...offer.itineraries.map((i) => i.segments.length - 1));
+        counts.set(maxStops, (counts.get(maxStops) ?? 0) + 1);
+    }
+    return Array.from(counts.entries())
+        .map(([stops, count]) => ({ stops, count }))
+        .sort((a, b) => a.stops - b.stops);
+}
+// ─────────────────────────────────────────────────────────────────────────────
+// Price
+// ─────────────────────────────────────────────────────────────────────────────
+function PriceFilter({ value, onChange, }) {
+    const preview = value != null ? _jsxs("span", { className: "text-muted-foreground", children: ["\u00B7 \u2264 ", value] }) : null;
+    return (_jsxs(Popover, { children: [_jsx(PopoverTrigger, { render: _jsx(Button, { variant: "outline", size: "sm", className: TRIGGER_CLASS }), children: _jsx(TriggerContents, { label: "Price", preview: preview }) }), _jsx(PopoverContent, { className: "w-[240px] p-3", align: "start", children: _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("span", { className: "text-xs font-medium text-muted-foreground", children: "Maximum price" }), _jsx(Input, { type: "number", inputMode: "decimal", min: 0, placeholder: "No cap", defaultValue: value ?? "", className: "h-8", onBlur: (e) => {
+                                const n = Number(e.target.value);
+                                onChange(Number.isFinite(n) && n > 0 ? n : null);
+                            } }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => onChange(null), disabled: value == null, className: "self-start", children: "Clear" })] }) })] }));
+}

package/dist/components/flight-itinerary.d.ts

@@ -0,0 +1,28 @@
+import type { Itinerary } from "@voyantjs/flights/contract/types";
+export interface FlightItineraryProps {
+    itinerary: Itinerary;
+    /** Optional label shown above the segment list (e.g. "Outbound", "Return"). */
+    label?: string;
+    /** Optional sub-label, typically the dated city pair: "BUH → LON · Mon, 13 Jul". */
+    sublabel?: string;
+    carrierName?: (iataCode: string) => string | undefined;
+    airportName?: (iataCode: string) => string | undefined;
+    aircraftName?: (iataCode: string) => string | undefined;
+    /** Compact rendering for use inside the ledger / right rail. */
+    compact?: boolean;
+    className?: string;
+}
+/**
+ * Carrier-aware itinerary renderer. One itinerary = one direction of travel
+ * (outbound, return, or one leg of an open-jaw). Surfaces:
+ *  - per-segment carrier + flight number
+ *  - operating-vs-marketing carrier ("Operated by …") for codeshares
+ *  - layover dwell time chips between segments
+ *  - aircraft per segment
+ *  - total journey duration
+ *
+ * `compact` strips the per-segment cards down to a single timeline row —
+ * suitable for the booking ledger.
+ */
+export declare function FlightItinerary({ itinerary, label, sublabel, carrierName, airportName, aircraftName, compact, className, }: FlightItineraryProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=flight-itinerary.d.ts.map

package/dist/components/flight-itinerary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"flight-itinerary.d.ts","sourceRoot":"","sources":["../../src/components/flight-itinerary.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,kCAAkC,CAAA;AAOhF,MAAM,WAAW,oBAAoB;IACnC,SAAS,EAAE,SAAS,CAAA;IACpB,+EAA+E;IAC/E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oFAAoF;IACpF,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;IACtD,WAAW,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;IACtD,YAAY,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;IACvD,gEAAgE;IAChE,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,KAAK,EACL,QAAQ,EACR,WAAW,EACX,WAAW,EACX,YAAY,EACZ,OAAO,EACP,SAAS,GACV,EAAE,oBAAoB,kDA4EtB"}

package/dist/components/flight-itinerary.js

@@ -0,0 +1,90 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Badge } from "@voyantjs/ui/components/badge";
+import { cn } from "@voyantjs/ui/lib/utils";
+import { Plane } from "lucide-react";
+import { AirlineLogo } from "./airline-logo";
+/**
+ * Carrier-aware itinerary renderer. One itinerary = one direction of travel
+ * (outbound, return, or one leg of an open-jaw). Surfaces:
+ *  - per-segment carrier + flight number
+ *  - operating-vs-marketing carrier ("Operated by …") for codeshares
+ *  - layover dwell time chips between segments
+ *  - aircraft per segment
+ *  - total journey duration
+ *
+ * `compact` strips the per-segment cards down to a single timeline row —
+ * suitable for the booking ledger.
+ */
+export function FlightItinerary({ itinerary, label, sublabel, carrierName, airportName, aircraftName, compact, className, }) {
+    const segs = itinerary.segments;
+    const first = segs[0];
+    const last = segs[segs.length - 1];
+    if (!first || !last)
+        return null;
+    const stops = segs.length - 1;
+    const totalDuration = itinerary.duration ?? deriveDuration(first, last);
+    const carriers = Array.from(new Set(segs.map((s) => s.carrierCode)));
+    if (compact) {
+        return (_jsxs("div", { className: cn("flex flex-col gap-1.5", className), children: [(label || sublabel) && (_jsxs("div", { className: "flex items-baseline justify-between gap-2", children: [label && (_jsx("span", { className: "font-medium text-[11px] uppercase tracking-wider text-muted-foreground", children: label })), sublabel && _jsx("span", { className: "text-[11px] text-muted-foreground", children: sublabel })] })), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "flex shrink-0 items-center -space-x-1", children: carriers.map((code) => (_jsx(AirlineLogo, { iataCode: code, name: carrierName?.(code), size: 20 }, code))) }), _jsxs("span", { className: "font-mono text-xs text-foreground", children: [first.departure.iataCode, " \u2192 ", last.arrival.iataCode] }), _jsxs("span", { className: "text-[11px] text-muted-foreground", children: [formatTime(first.departure.at), " \u2013 ", formatTime(last.arrival.at)] }), _jsxs("span", { className: "ml-auto text-[11px] text-muted-foreground", children: [stops === 0 ? "Nonstop" : `${stops} stop${stops > 1 ? "s" : ""}`, totalDuration && ` · ${formatDuration(totalDuration)}`] })] })] }));
+    }
+    return (_jsxs("div", { className: cn("flex flex-col gap-3", className), children: [(label || sublabel) && (_jsxs("div", { className: "flex items-baseline justify-between gap-2", children: [label && (_jsx("h4", { className: "font-medium text-[11px] uppercase tracking-wider text-muted-foreground", children: label })), (sublabel || totalDuration) && (_jsxs("span", { className: "text-[11px] text-muted-foreground", children: [sublabel, sublabel && totalDuration && " · ", totalDuration && `Total ${formatDuration(totalDuration)}`] }))] })), _jsx("div", { className: "flex flex-col", children: segs.map((seg, idx) => (_jsx(SegmentBlock, { segment: seg, carrierName: carrierName, airportName: airportName, aircraftName: aircraftName, layoverBefore: idx > 0 ? layoverBetween(segs[idx - 1], seg) : null }, seg.segmentId))) })] }));
+}
+// ─────────────────────────────────────────────────────────────────────────────
+function SegmentBlock({ segment, carrierName, airportName, aircraftName, layoverBefore, }) {
+    const isCodeshare = segment.operatingCarrierCode != null && segment.operatingCarrierCode !== segment.carrierCode;
+    return (_jsxs(_Fragment, { children: [layoverBefore && (_jsxs("div", { className: "my-1 flex items-center gap-2 px-2 text-xs text-muted-foreground", children: [_jsx("div", { className: "h-px flex-1 bg-border" }), _jsxs("span", { className: "rounded-full bg-muted px-2 py-0.5 text-[11px]", children: ["Layover \u00B7 ", layoverBefore.dwell, " in ", layoverBefore.airport] }), _jsx("div", { className: "h-px flex-1 bg-border" })] })), _jsxs("div", { className: "rounded-lg border bg-card p-3", children: [_jsxs("div", { className: "mb-2 flex flex-wrap items-center gap-2", children: [_jsx(AirlineLogo, { iataCode: segment.carrierCode, name: carrierName?.(segment.carrierCode), size: 24 }), _jsx("span", { className: "font-medium text-sm", children: carrierName?.(segment.carrierCode) ?? segment.carrierCode }), _jsxs("span", { className: "font-mono text-muted-foreground text-xs", children: [segment.carrierCode, segment.flightNumber] }), isCodeshare && (_jsxs(Badge, { variant: "secondary", className: "text-[10px] uppercase tracking-wide", children: ["Operated by", " ", carrierName?.(segment.operatingCarrierCode ?? "") ?? segment.operatingCarrierCode] })), _jsx(Badge, { variant: "outline", className: "ml-auto capitalize", children: segment.cabin.replace("_", " ") })] }), _jsxs("div", { className: "grid grid-cols-[1fr_auto_1fr] items-center gap-3", children: [_jsx(Endpoint, { at: segment.departure.at, iata: segment.departure.iataCode, terminal: segment.departure.terminal, airportName: airportName?.(segment.departure.iataCode) }), _jsxs("div", { className: "flex flex-col items-center gap-1 text-muted-foreground text-xs", children: [_jsx(Plane, { className: "h-3.5 w-3.5" }), segment.duration && _jsx("span", { children: formatDuration(segment.duration) })] }), _jsx(Endpoint, { at: segment.arrival.at, iata: segment.arrival.iataCode, terminal: segment.arrival.terminal, airportName: airportName?.(segment.arrival.iataCode), align: "end" })] }), segment.aircraft && (_jsxs("div", { className: "mt-2 text-[11px] text-muted-foreground", children: ["Aircraft:", " ", _jsx("span", { className: "text-foreground", children: aircraftName?.(segment.aircraft) ?? segment.aircraft })] }))] })] }));
+}
+function Endpoint({ at, iata, terminal, airportName, align = "start", }) {
+    return (_jsxs("div", { className: cn("flex flex-col leading-tight", align === "end" ? "items-end" : "items-start"), children: [_jsx("span", { className: "font-semibold text-lg tabular-nums", children: formatTime(at) }), _jsx("span", { className: "font-mono text-muted-foreground text-xs", children: iata }), airportName && _jsx("span", { className: "text-[11px] text-muted-foreground", children: airportName }), terminal && _jsxs("span", { className: "text-[10px] text-muted-foreground", children: ["Terminal ", terminal] }), _jsx("span", { className: "mt-0.5 text-[10px] text-muted-foreground", children: formatDate(at) })] }));
+}
+// ── Formatters ───────────────────────────────────────────────────────────────
+function formatTime(iso) {
+    const d = new Date(iso);
+    if (Number.isNaN(d.getTime()))
+        return iso;
+    return new Intl.DateTimeFormat(undefined, { hour: "2-digit", minute: "2-digit" }).format(d);
+}
+function formatDate(iso) {
+    const d = new Date(iso);
+    if (Number.isNaN(d.getTime()))
+        return iso;
+    return new Intl.DateTimeFormat(undefined, {
+        weekday: "short",
+        day: "numeric",
+        month: "short",
+    }).format(d);
+}
+function formatDuration(iso) {
+    if (!iso)
+        return "";
+    const m = /^PT(?:(\d+)H)?(?:(\d+)M)?$/.exec(iso);
+    if (!m)
+        return iso;
+    const h = m[1] ? `${m[1]}h` : "";
+    const min = m[2] ? `${m[2]}m` : "";
+    return [h, min].filter(Boolean).join(" ") || iso;
+}
+function layoverBetween(prev, next) {
+    if (!prev)
+        return null;
+    const a = new Date(prev.arrival.at).getTime();
+    const b = new Date(next.departure.at).getTime();
+    if (Number.isNaN(a) || Number.isNaN(b) || b <= a)
+        return null;
+    const minutes = Math.round((b - a) / 60000);
+    const h = Math.floor(minutes / 60);
+    const m = minutes % 60;
+    const dwell = [h ? `${h}h` : "", m ? `${m}m` : ""].filter(Boolean).join(" ") || `${minutes}m`;
+    return { airport: prev.arrival.iataCode, dwell };
+}
+function deriveDuration(first, last) {
+    const a = new Date(first.departure.at).getTime();
+    const b = new Date(last.arrival.at).getTime();
+    if (Number.isNaN(a) || Number.isNaN(b) || b <= a)
+        return undefined;
+    const minutes = Math.round((b - a) / 60000);
+    const h = Math.floor(minutes / 60);
+    const m = minutes % 60;
+    return `PT${h}H${m}M`;
+}

package/dist/components/flight-offer-detail.d.ts

@@ -0,0 +1,21 @@
+import type { FlightOffer } from "@voyantjs/flights/contract/types";
+export interface FlightOfferDetailProps {
+    offer: FlightOffer;
+    /** Resolves IATA carrier code → human-readable name. */
+    carrierName?: (iataCode: string) => string | undefined;
+    /** Resolves IATA airport code → "City Name (IATA)" or similar. */
+    airportName?: (iataCode: string) => string | undefined;
+    /** Resolves IATA aircraft code → "Boeing 737-800" or similar. */
+    aircraftName?: (iataCode: string) => string | undefined;
+    /** Override per-itinerary labels (defaults to "Outbound" / "Return" / "Leg N"). */
+    itineraryLabels?: string[];
+    className?: string;
+}
+/**
+ * Full-fidelity flight offer view for the detail sheet. Composes the shared
+ * `FlightItinerary` renderer for each leg, then a fare breakdown + offer
+ * metadata. Codeshare segments and layover dwell times are surfaced by the
+ * itinerary component itself.
+ */
+export declare function FlightOfferDetail({ offer, carrierName, airportName, aircraftName, itineraryLabels, className, }: FlightOfferDetailProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=flight-offer-detail.d.ts.map

package/dist/components/flight-offer-detail.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"flight-offer-detail.d.ts","sourceRoot":"","sources":["../../src/components/flight-offer-detail.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAiB,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAOlF,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,WAAW,CAAA;IAClB,wDAAwD;IACxD,WAAW,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;IACtD,kEAAkE;IAClE,WAAW,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;IACtD,iEAAiE;IACjE,YAAY,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;IACvD,mFAAmF;IACnF,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,WAAW,EACX,WAAW,EACX,YAAY,EACZ,eAAe,EACf,SAAS,GACV,EAAE,sBAAsB,2CAwDxB"}

package/dist/components/flight-offer-detail.js

@@ -0,0 +1,61 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge } from "@voyantjs/ui/components/badge";
+import { Separator } from "@voyantjs/ui/components/separator";
+import { cn } from "@voyantjs/ui/lib/utils";
+import { FlightItinerary } from "./flight-itinerary";
+/**
+ * Full-fidelity flight offer view for the detail sheet. Composes the shared
+ * `FlightItinerary` renderer for each leg, then a fare breakdown + offer
+ * metadata. Codeshare segments and layover dwell times are surfaced by the
+ * itinerary component itself.
+ */
+export function FlightOfferDetail({ offer, carrierName, airportName, aircraftName, itineraryLabels, className, }) {
+    return (_jsxs("div", { className: cn("flex flex-col gap-6", className), children: [_jsx("section", { className: "flex flex-col gap-5", children: offer.itineraries.map((itin, i) => (_jsx(FlightItinerary
+                // biome-ignore lint/suspicious/noArrayIndexKey: itineraries are positional (outbound/return)
+                , { itinerary: itin, label: itineraryLabels?.[i] ?? defaultItineraryLabel(i, offer.itineraries.length), carrierName: carrierName, airportName: airportName, aircraftName: aircraftName }, i))) }), _jsxs("section", { className: "flex flex-col gap-2", children: [_jsx("h4", { className: "font-medium text-[11px] uppercase tracking-wider text-muted-foreground", children: "Fare breakdown" }), _jsxs("div", { className: "overflow-hidden rounded-lg border", children: [offer.fareBreakdowns.map((b, i) => (_jsx(FareRow, { breakdown: b }, i))), _jsx(Separator, {}), _jsxs("div", { className: "flex items-center justify-between bg-muted/30 px-4 py-3", children: [_jsx("span", { className: "font-medium text-sm", children: "Total" }), _jsx("span", { className: "font-semibold text-base tabular-nums", children: formatMoney(offer.totalPrice.amount, offer.totalPrice.currency) })] })] })] }), (offer.validatingCarrier ||
+                offer.expiresAt ||
+                offer.lastTicketingDate ||
+                offer.instantTicketing) && (_jsxs("section", { className: "flex flex-wrap items-center gap-2 text-muted-foreground text-xs", children: [offer.validatingCarrier && (_jsxs("span", { children: ["Validating carrier:", " ", _jsx("span", { className: "font-mono text-foreground", children: offer.validatingCarrier })] })), offer.expiresAt && _jsxs("span", { children: ["\u00B7 Expires ", formatDateTime(offer.expiresAt)] }), offer.lastTicketingDate && (_jsxs("span", { children: ["\u00B7 Last ticketing ", formatDate(offer.lastTicketingDate)] })), offer.instantTicketing && _jsx(Badge, { variant: "secondary", children: "Instant ticketing" })] }))] }));
+}
+function defaultItineraryLabel(idx, total) {
+    if (total === 1)
+        return "Itinerary";
+    if (total === 2)
+        return idx === 0 ? "Outbound" : "Return";
+    return `Leg ${idx + 1}`;
+}
+function FareRow({ breakdown }) {
+    return (_jsxs("div", { className: "flex items-center justify-between gap-4 px-4 py-2.5 text-sm", children: [_jsxs("div", { className: "flex flex-col leading-tight", children: [_jsxs("span", { className: "capitalize", children: [breakdown.passengerCount, "\u00D7 ", breakdown.passengerType] }), breakdown.fareFamily && (_jsx("span", { className: "text-muted-foreground text-xs", children: breakdown.fareFamily }))] }), _jsxs("div", { className: "flex items-center gap-4 text-muted-foreground text-xs tabular-nums", children: [_jsxs("span", { children: ["Base ", formatMoney(breakdown.baseFare.amount, breakdown.baseFare.currency)] }), _jsxs("span", { children: ["Tax ", formatMoney(breakdown.taxes.amount, breakdown.taxes.currency)] }), _jsx("span", { className: "font-medium text-foreground text-sm", children: formatMoney(breakdown.total.amount, breakdown.total.currency) })] })] }));
+}
+function formatMoney(amount, currency) {
+    const n = Number(amount);
+    if (!Number.isFinite(n))
+        return `${amount} ${currency}`;
+    return new Intl.NumberFormat(undefined, {
+        style: "currency",
+        currency,
+        maximumFractionDigits: 0,
+    }).format(n);
+}
+function formatDate(iso) {
+    const d = new Date(iso);
+    if (Number.isNaN(d.getTime()))
+        return iso;
+    return new Intl.DateTimeFormat(undefined, {
+        weekday: "short",
+        day: "numeric",
+        month: "short",
+    }).format(d);
+}
+function formatDateTime(iso) {
+    const d = new Date(iso);
+    if (Number.isNaN(d.getTime()))
+        return iso;
+    return new Intl.DateTimeFormat(undefined, {
+        day: "numeric",
+        month: "short",
+        hour: "2-digit",
+        minute: "2-digit",
+    }).format(d);
+}

package/dist/components/flight-offer-row.d.ts

@@ -0,0 +1,25 @@
+import type { FlightOffer } from "@voyantjs/flights/contract/types";
+export interface FlightOfferRowProps {
+    offer: FlightOffer;
+    /** Click handler — typically opens the detail sheet. */
+    onClick?: (offer: FlightOffer) => void;
+    /** "Select" CTA — when set, renders a primary button alongside the price. */
+    onSelect?: (offer: FlightOffer) => void;
+    /** Customize the select CTA label. Defaults to "Select". */
+    selectLabel?: string;
+    /** Optional carrier name resolver — used for the logo `alt` text. */
+    carrierName?: (iataCode: string) => string | undefined;
+    /** Highlight ring (e.g. when this offer is currently picked). */
+    selected?: boolean;
+    className?: string;
+}
+/**
+ * One row in the search-results list. Lays out each itinerary on its own
+ * line: carriers · departure time · journey · arrival time · stops ·
+ * duration. Total price sits on the right with an optional "Select" CTA.
+ *
+ * For per-leg searches, each offer carries one itinerary; for combined
+ * round-trip searches it carries two. The renderer handles both shapes.
+ */
+export declare function FlightOfferRow({ offer, onClick, onSelect, selectLabel, carrierName, selected, className, }: FlightOfferRowProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=flight-offer-row.d.ts.map

package/dist/components/flight-offer-row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"flight-offer-row.d.ts","sourceRoot":"","sources":["../../src/components/flight-offer-row.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAa,MAAM,kCAAkC,CAAA;AAO9E,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,WAAW,CAAA;IAClB,wDAAwD;IACxD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAA;IACtC,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAA;IACvC,4DAA4D;IAC5D,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,qEAAqE;IACrE,WAAW,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;IACtD,iEAAiE;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;;;;;GAOG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,OAAO,EACP,QAAQ,EACR,WAAsB,EACtB,WAAW,EACX,QAAQ,EACR,SAAS,GACV,EAAE,mBAAmB,2CAwCrB"}

package/dist/components/flight-offer-row.js

@@ -0,0 +1,74 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge } from "@voyantjs/ui/components/badge";
+import { cn } from "@voyantjs/ui/lib/utils";
+import { Plane } from "lucide-react";
+import { AirlineLogo } from "./airline-logo";
+/**
+ * One row in the search-results list. Lays out each itinerary on its own
+ * line: carriers · departure time · journey · arrival time · stops ·
+ * duration. Total price sits on the right with an optional "Select" CTA.
+ *
+ * For per-leg searches, each offer carries one itinerary; for combined
+ * round-trip searches it carries two. The renderer handles both shapes.
+ */
+export function FlightOfferRow({ offer, onClick, onSelect, selectLabel = "Select", carrierName, selected, className, }) {
+    const interactive = !!onClick;
+    const Container = interactive ? "button" : "div";
+    return (_jsxs(Container, { type: interactive ? "button" : undefined, onClick: onClick ? () => onClick(offer) : undefined, className: cn("flex w-full items-stretch gap-4 rounded-lg border bg-card p-4 text-left shadow-sm transition-colors", interactive && "hover:border-primary/40 hover:bg-accent/30", selected && "border-primary ring-1 ring-primary/40", className), children: [_jsx("div", { className: "flex min-w-0 flex-1 flex-col gap-3", children: offer.itineraries.map((itin, i) => (_jsx(ItineraryRow, { itinerary: itin, carrierName: carrierName }, i))) }), _jsxs("div", { className: "flex shrink-0 flex-col items-end justify-center gap-2 border-l pl-4", children: [_jsx("div", { className: "font-semibold text-2xl tabular-nums", children: formatMoney(offer.totalPrice.amount, offer.totalPrice.currency) }), _jsx(PriceFootnote, { offer: offer }), onSelect && (_jsx("button", { type: "button", onClick: (e) => {
+                            e.stopPropagation();
+                            onSelect(offer);
+                        }, className: "mt-1 inline-flex h-8 items-center justify-center rounded-md bg-primary px-3 font-medium text-primary-foreground text-xs hover:bg-primary/90", children: selectLabel }))] })] }));
+}
+function PriceFootnote({ offer }) {
+    const totalPax = offer.fareBreakdowns.reduce((n, b) => n + b.passengerCount, 0);
+    const adult = offer.fareBreakdowns.find((b) => b.passengerType === "adult");
+    if (totalPax <= 1) {
+        return _jsx("div", { className: "text-muted-foreground text-xs", children: "total" });
+    }
+    return (_jsxs("div", { className: "flex flex-col items-end gap-0.5 text-muted-foreground text-xs", children: [_jsxs("span", { children: ["total \u00B7 ", totalPax, " pax"] }), adult && (_jsxs("span", { children: [formatMoney(adult.total.amount, adult.total.currency), _jsx("span", { className: "ml-0.5 text-muted-foreground/70", children: "/adult" })] }))] }));
+}
+function ItineraryRow({ itinerary, carrierName, }) {
+    const segs = itinerary.segments;
+    const first = segs[0];
+    const last = segs[segs.length - 1];
+    if (!first || !last)
+        return null;
+    const carriers = Array.from(new Set(segs.map((s) => s.carrierCode)));
+    const stops = segs.length - 1;
+    const hasCodeshare = segs.some((s) => s.operatingCarrierCode != null && s.operatingCarrierCode !== s.carrierCode);
+    const hasInterline = carriers.length > 1;
+    return (_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex shrink-0 items-center -space-x-1.5", children: carriers.map((code) => (_jsx(AirlineLogo, { iataCode: code, name: carrierName?.(code), size: 28 }, code))) }), _jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-3", children: [_jsx(Endpoint, { at: first.departure.at, iata: first.departure.iataCode }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col items-center gap-1", children: [_jsx("div", { className: "text-[11px] text-muted-foreground", children: formatDuration(itinerary.duration) }), _jsxs("div", { className: "flex w-full items-center gap-1.5", children: [_jsx("div", { className: "h-px flex-1 bg-border" }), _jsx(Plane, { className: "h-3 w-3 text-muted-foreground" }), _jsx("div", { className: "h-px flex-1 bg-border" })] }), _jsxs("div", { className: "flex flex-wrap items-center justify-center gap-1.5 text-[11px] text-muted-foreground", children: [stops === 0 ? (_jsx("span", { className: "font-medium text-emerald-600", children: "Nonstop" })) : (_jsxs("span", { children: [stops, " stop", stops > 1 ? "s" : "", " via", " ", segs
+                                                .slice(0, -1)
+                                                .map((s) => s.arrival.iataCode)
+                                                .join(", ")] })), hasInterline && (_jsx(Badge, { variant: "secondary", className: "px-1.5 py-0 text-[9px]", children: "Interline" })), hasCodeshare && (_jsx(Badge, { variant: "secondary", className: "px-1.5 py-0 text-[9px]", children: "Codeshare" }))] })] }), _jsx(Endpoint, { at: last.arrival.at, iata: last.arrival.iataCode, align: "end" })] }), _jsx(Badge, { variant: "outline", className: "shrink-0 capitalize", children: first.cabin.replace("_", " ") })] }));
+}
+function Endpoint({ at, iata, align = "start", }) {
+    return (_jsxs("div", { className: cn("flex shrink-0 flex-col leading-tight", align === "end" ? "items-end" : "items-start"), children: [_jsx("span", { className: "font-semibold text-base tabular-nums", children: formatTime(at) }), _jsx("span", { className: "font-mono text-muted-foreground text-xs", children: iata })] }));
+}
+function formatMoney(amount, currency) {
+    const n = Number(amount);
+    if (!Number.isFinite(n))
+        return `${amount} ${currency}`;
+    return new Intl.NumberFormat(undefined, {
+        style: "currency",
+        currency,
+        maximumFractionDigits: 0,
+    }).format(n);
+}
+function formatTime(iso) {
+    const d = new Date(iso);
+    if (Number.isNaN(d.getTime()))
+        return iso;
+    return new Intl.DateTimeFormat(undefined, { hour: "2-digit", minute: "2-digit" }).format(d);
+}
+function formatDuration(iso) {
+    if (!iso)
+        return "";
+    const m = /^PT(?:(\d+)H)?(?:(\d+)M)?$/.exec(iso);
+    if (!m)
+        return iso;
+    const h = m[1] ? `${m[1]}h` : "";
+    const min = m[2] ? `${m[2]}m` : "";
+    return [h, min].filter(Boolean).join(" ") || iso;
+}

package/dist/components/flight-order-confirmation.d.ts

@@ -0,0 +1,13 @@
+import type { FlightOrder } from "@voyantjs/flights/contract/types";
+export interface FlightOrderConfirmationProps {
+    order: FlightOrder;
+    /** Optional cancel button — pass when the order is still cancellable. */
+    onCancel?: (order: FlightOrder) => void;
+    cancelLoading?: boolean;
+    /** IATA → human-readable resolvers, forwarded to the embedded offer detail. */
+    carrierName?: (iataCode: string) => string | undefined;
+    airportName?: (iataCode: string) => string | undefined;
+    aircraftName?: (iataCode: string) => string | undefined;
+}
+export declare function FlightOrderConfirmation({ order, onCancel, cancelLoading, carrierName, airportName, aircraftName, }: FlightOrderConfirmationProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=flight-order-confirmation.d.ts.map

package/dist/components/flight-order-confirmation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"flight-order-confirmation.d.ts","sourceRoot":"","sources":["../../src/components/flight-order-confirmation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAUnE,MAAM,WAAW,4BAA4B;IAC3C,KAAK,EAAE,WAAW,CAAA;IAClB,yEAAyE;IACzE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAA;IACvC,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;IACtD,WAAW,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;IACtD,YAAY,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;CACxD;AAaD,wBAAgB,uBAAuB,CAAC,EACtC,KAAK,EACL,QAAQ,EACR,aAAa,EACb,WAAW,EACX,WAAW,EACX,YAAY,GACb,EAAE,4BAA4B,2CAwH9B"}