@voyant-travel/catalog-react 0.117.2

package/dist/components/catalog-detail-sheet.d.ts

@@ -0,0 +1,93 @@
+import { type ReactNode } from "react";
+import type { CatalogDeparturePricingRow, CatalogDetailEnrichment, CatalogSearchHit } from "../index.js";
+export { CatalogDetailView, type CatalogDetailViewProps } from "./catalog-detail-view.js";
+export interface CatalogDetailAction {
+    label: string;
+    onClick: (hit: CatalogSearchHit) => void;
+    variant?: "default" | "secondary" | "outline" | "ghost";
+    /**
+     * Optional predicate to hide the action for specific hits — e.g. only
+     * show "Open editor" when the hit is an owned product. Defaults to
+     * always-visible when omitted.
+     */
+    visible?: (hit: CatalogSearchHit) => boolean;
+}
+export type { CatalogDetailEnrichment };
+export type CatalogDetailSheetWidth = "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | string;
+export type CatalogDetailItineraryDay = NonNullable<CatalogDetailEnrichment["itinerary"]>[number];
+export type CatalogDetailRenderSlot = (hit: CatalogSearchHit, enrichment: CatalogDetailEnrichment | null) => ReactNode;
+export interface CatalogDetailSheetProps {
+    hit: CatalogSearchHit | null;
+    onOpenChange: (open: boolean) => void;
+    formatters?: Record<string, (value: unknown) => ReactNode>;
+    actions?: CatalogDetailAction[];
+    imageField?: string;
+    /**
+     * The catalog vertical this sheet renders. Used for per-vertical labels —
+     * e.g. cruises label the "Options" tab "Cabins" since the options are cabin
+     * categories.
+     */
+    vertical?: string;
+    /**
+     * Sheet max-width token or class name. Defaults to `5xl` so rich catalog
+     * details can use two columns on wide operator screens.
+     */
+    width?: CatalogDetailSheetWidth;
+    /** Secondary header content such as print/download icon buttons. */
+    headerExtras?: ReactNode | CatalogDetailRenderSlot;
+    /**
+     * Called once when the sheet opens for a hit. The result is rendered
+     * in dedicated sections (description, highlights, itinerary, media,
+     * options, policies). Errors swallowed silently — the sheet still
+     * shows the indexed-projection fallback.
+     */
+    onLoadDetail?: (hit: CatalogSearchHit) => Promise<CatalogDetailEnrichment | null>;
+    /**
+     * Called lazily when a departure (cruise sailing) row expands, to fetch live
+     * per-cabin pricing + availability. Returns `null` when unavailable. The
+     * caller binds the vertical; the sheet passes the cruise hit + sailing ref.
+     */
+    onLoadDeparturePricing?: (hit: CatalogSearchHit, sailingRef: string) => Promise<CatalogDeparturePricingRow[] | null>;
+    /**
+     * Called when the operator clicks a per-departure Book button. When
+     * omitted, departures render without a book affordance — the
+     * sheet-level `actions` (e.g. "Book this") still apply.
+     */
+    onBookDeparture?: (hit: CatalogSearchHit, departure: NonNullable<CatalogDetailEnrichment["departures"]>[number]) => void;
+    /**
+     * Per-option book affordance. When set, the expanded departure panel
+     * renders a Book button on each option row; the callback receives the
+     * departure plus the chosen option so the booking journey can
+     * pre-select it. Falls back to `onBookDeparture` when omitted.
+     */
+    onBookOption?: (hit: CatalogSearchHit, departure: NonNullable<CatalogDetailEnrichment["departures"]>[number], option: NonNullable<CatalogDetailEnrichment["options"]>[number]) => void;
+    /** Dedicated brochure/print section rendered above media. */
+    renderBrochure?: CatalogDetailRenderSlot;
+    /** Consumer-provided media rendering, replacing the default thumbnail grid. */
+    renderMedia?: CatalogDetailRenderSlot;
+    /** Consumer-provided itinerary day renderer for richer day cards. */
+    renderItineraryDay?: (day: CatalogDetailItineraryDay, hit: CatalogSearchHit, enrichment: CatalogDetailEnrichment) => ReactNode;
+    /** Additional consumer sections rendered above the footer actions. */
+    renderExtraSections?: CatalogDetailRenderSlot;
+    /**
+     * Render a clickable supplier link in the Attributes tab. When set,
+     * the `supplierId` row uses this renderer instead of the plain
+     * formatter — typically a router-aware Link to the supplier detail
+     * page. Receives the supplier id and the display name (already
+     * resolved by `formatters.supplierId`).
+     */
+    renderSupplierLink?: (supplierId: string, displayName: string) => ReactNode;
+    /**
+     * When provided, the Tags row in the Overview tab swaps its read-only
+     * chips for an inline add/remove editor. The callback is invoked with
+     * the *next* tag list (after the local optimistic update); rejecting
+     * the promise reverts to the indexed tags.
+     *
+     * Only the `tags` field — the operator-authored jsonb list — is
+     * editable. Index-derived arrays (categories, regions, etc.) stay
+     * read-only because they're computed from elsewhere.
+     */
+    onTagsChange?: (hit: CatalogSearchHit, tags: string[]) => Promise<void> | void;
+}
+export declare function CatalogDetailSheet({ hit, onOpenChange, formatters, actions, imageField, width, vertical, headerExtras, onLoadDetail, onLoadDeparturePricing, onBookDeparture, onBookOption, renderBrochure, renderMedia, renderItineraryDay, renderExtraSections, renderSupplierLink, onTagsChange, }: CatalogDetailSheetProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=catalog-detail-sheet.d.ts.map

package/dist/components/catalog-detail-sheet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog-detail-sheet.d.ts","sourceRoot":"","sources":["../../src/components/catalog-detail-sheet.tsx"],"names":[],"mappings":"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"}

package/dist/components/catalog-detail-sheet.js

@@ -0,0 +1,68 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge } from "@voyant-travel/ui/components/badge";
+import { Button } from "@voyant-travel/ui/components/button";
+import { Sheet, SheetContent, SheetFooter, SheetHeader, SheetTitle, } from "@voyant-travel/ui/components/sheet";
+import { cn } from "@voyant-travel/ui/lib/utils";
+import { useEffect, useState } from "react";
+import { useCatalogUiMessagesOrDefault } from "../i18n/index.js";
+import { formatTemplate, IdChip, initialsOf, ProductPriceFrom, sheetWidthClass, stringOr, } from "./catalog-detail-parts.js";
+import { CatalogDetailView } from "./catalog-detail-view.js";
+export { CatalogDetailView } from "./catalog-detail-view.js";
+export function CatalogDetailSheet({ hit, onOpenChange, formatters, actions, imageField = "thumbnailUrl", width = "5xl", vertical, headerExtras, onLoadDetail, onLoadDeparturePricing, onBookDeparture, onBookOption, renderBrochure, renderMedia, renderItineraryDay, renderExtraSections, renderSupplierLink, onTagsChange, }) {
+    const catalogMessages = useCatalogUiMessagesOrDefault().catalogPage;
+    const messages = catalogMessages.detail;
+    const open = hit != null;
+    const fields = hit?.document.fields ?? {};
+    const name = stringOr(fields.name, catalogMessages.fallbacks.detailName);
+    const status = stringOr(fields.status, null);
+    // Enrichment fetch — fires when the sheet opens for a hit. The
+    // useEffect dep list includes hit.id so re-opening a different row
+    // refetches; the result is local to the open instance, so closing
+    // the sheet clears it.
+    const [enrichment, setEnrichment] = useState(null);
+    const [enrichmentLoading, setEnrichmentLoading] = useState(false);
+    useEffect(() => {
+        if (!hit || !onLoadDetail) {
+            setEnrichment(null);
+            setEnrichmentLoading(false);
+            return;
+        }
+        let cancelled = false;
+        setEnrichmentLoading(true);
+        setEnrichment(null);
+        onLoadDetail(hit)
+            .then((result) => {
+            if (!cancelled) {
+                setEnrichment(result ?? null);
+                setEnrichmentLoading(false);
+            }
+        })
+            .catch(() => {
+            if (!cancelled) {
+                setEnrichment(null);
+                setEnrichmentLoading(false);
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [hit, onLoadDetail]);
+    const imageUrl = stringOr(enrichment?.heroImageUrl, null) ?? stringOr(fields[imageField], null);
+    const resolvedHeaderExtras = hit && headerExtras
+        ? typeof headerExtras === "function"
+            ? headerExtras(hit, enrichment)
+            : headerExtras
+        : null;
+    return (_jsx(Sheet, { open: open, onOpenChange: onOpenChange, children: _jsx(SheetContent, { className: cn("w-full p-0", sheetWidthClass(width)), children: _jsxs("div", { className: "flex h-full flex-col", children: [_jsx(SheetHeader, { className: "border-b bg-muted/20 px-6 py-5", children: _jsxs("div", { className: "flex items-start justify-between gap-4 pr-8", children: [_jsxs("div", { className: "flex min-w-0 items-start gap-4", children: [imageUrl ? (_jsx("img", { src: imageUrl, alt: name, className: "h-16 w-16 shrink-0 rounded-lg object-cover ring-1 ring-border", loading: "lazy" })) : (_jsx("div", { className: "flex h-16 w-16 shrink-0 items-center justify-center rounded-lg bg-gradient-to-br from-sky-500 to-indigo-600 text-lg font-medium text-white ring-1 ring-border", children: initialsOf(name) })), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [_jsx(SheetTitle, { className: "text-base leading-snug", children: name }), _jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [status && (_jsx(Badge, { variant: status === "active" || status === "live" ? "default" : "secondary", className: "capitalize", children: status })), hit?.id && _jsx(IdChip, { id: hit.id }), enrichment?.servedLocale && (_jsx(Badge, { variant: "outline", className: "font-normal", children: enrichment.servedLocale })), enrichment?.matchKind && enrichment.matchKind !== "exact" && (_jsx(Badge, { variant: "outline", className: "font-normal", children: formatTemplate(messages.matchPrefix, { kind: enrichment.matchKind }) })), enrichment?.source && (_jsx(Badge, { variant: enrichment.source === "synthesized" ? "outline" : "secondary", className: "font-normal", children: enrichment.source })), enrichment?.servedStale && (_jsx(Badge, { variant: "outline", className: "font-normal", children: messages.stale })), enrichment?.machineTranslated && (_jsx(Badge, { variant: "outline", className: "font-normal", children: "MT" }))] })] })] }), _jsxs("div", { className: "flex shrink-0 items-center gap-3", children: [_jsx(ProductPriceFrom, { enrichment: enrichment, fields: fields, messages: messages }), resolvedHeaderExtras && (_jsx("div", { className: "flex items-center gap-2", children: resolvedHeaderExtras }))] })] }) }), _jsx(CatalogDetailView, { hit: hit, enrichment: enrichment, enrichmentLoading: enrichmentLoading, vertical: vertical, formatters: formatters, renderBrochure: renderBrochure, renderMedia: renderMedia, renderItineraryDay: renderItineraryDay, renderExtraSections: renderExtraSections, renderSupplierLink: renderSupplierLink, onLoadDeparturePricing: onLoadDeparturePricing, onBookDeparture: onBookDeparture, onBookOption: onBookOption, onTagsChange: onTagsChange, className: "flex-1 overflow-y-auto px-6 py-5" }), (() => {
+                        if (!hit || !actions || actions.length === 0)
+                            return null;
+                        const visibleActions = actions.filter((a) => (a.visible ? a.visible(hit) : true));
+                        if (visibleActions.length === 0)
+                            return null;
+                        return (_jsx(SheetFooter, { className: "border-t bg-muted/20 px-6 py-3", children: _jsx("div", { className: "flex flex-wrap justify-end gap-2", children: visibleActions.map((a) => (_jsx(Button, { variant: a.variant ?? "default", size: "sm", onClick: () => {
+                                        a.onClick(hit);
+                                        onOpenChange(false);
+                                    }, children: a.label }, a.label))) }) }));
+                    })()] }) }) }));
+}

package/dist/components/catalog-detail-view.d.ts

@@ -0,0 +1,39 @@
+import { type ReactNode } from "react";
+import type { CatalogDeparturePricingRow, CatalogDetailEnrichment, CatalogSearchHit } from "../index.js";
+import type { CatalogDetailItineraryDay, CatalogDetailRenderSlot } from "./catalog-detail-sheet.js";
+/**
+ * Right-side detail sheet for any catalog hit. Header shows the entity's
+ * primary image, name, status, and id. Body is split into Description,
+ * Highlights/Tags (when present), and a clean two-column attribute grid.
+ * System provenance fields are tucked into a collapsible at the bottom.
+ */
+export interface CatalogDetailViewProps {
+    hit: CatalogSearchHit | null;
+    enrichment: CatalogDetailEnrichment | null;
+    /** Show the "loading full content" hint above the tabs. */
+    enrichmentLoading?: boolean;
+    vertical?: string;
+    formatters?: Record<string, (value: unknown) => ReactNode>;
+    renderBrochure?: CatalogDetailRenderSlot;
+    renderMedia?: CatalogDetailRenderSlot;
+    renderItineraryDay?: (day: CatalogDetailItineraryDay, hit: CatalogSearchHit, enrichment: CatalogDetailEnrichment) => ReactNode;
+    renderExtraSections?: CatalogDetailRenderSlot;
+    renderSupplierLink?: (supplierId: string, displayName: string) => ReactNode;
+    onLoadDeparturePricing?: (hit: CatalogSearchHit, sailingRef: string) => Promise<CatalogDeparturePricingRow[] | null>;
+    onBookDeparture?: (hit: CatalogSearchHit, departure: NonNullable<CatalogDetailEnrichment["departures"]>[number]) => void;
+    onBookOption?: (hit: CatalogSearchHit, departure: NonNullable<CatalogDetailEnrichment["departures"]>[number], option: NonNullable<CatalogDetailEnrichment["options"]>[number]) => void;
+    onTagsChange?: (hit: CatalogSearchHit, tags: string[]) => Promise<void> | void;
+    /** Wrapper className — the sheet scrolls (`flex-1 overflow-y-auto px-6 py-5`),
+     *  a full-page host can pass its own (or nothing). */
+    className?: string;
+}
+/**
+ * The tabbed detail BODY for a catalog hit — overview, itinerary, ship,
+ * cabins/rooms/options, departures/sailings (with live cabin pricing), media,
+ * policies, attributes. Layout-agnostic: it owns no modal/page chrome, so it's
+ * shared by {@link CatalogDetailSheet} (in a Sheet) and the operator's
+ * full-page, new-tab detail route. Enrichment is passed in (the host owns the
+ * fetch) since the host header also needs it.
+ */
+export declare function CatalogDetailView({ hit, enrichment, enrichmentLoading, vertical, formatters, renderBrochure, renderMedia, renderItineraryDay, renderExtraSections, renderSupplierLink, onLoadDeparturePricing, onBookDeparture, onBookOption, onTagsChange, className, }: CatalogDetailViewProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=catalog-detail-view.d.ts.map

package/dist/components/catalog-detail-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog-detail-view.d.ts","sourceRoot":"","sources":["../../src/components/catalog-detail-view.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAW,MAAM,OAAO,CAAA;AAE/C,OAAO,KAAK,EACV,0BAA0B,EAC1B,uBAAuB,EACvB,gBAAgB,EACjB,MAAM,aAAa,CAAA;AAcpB,OAAO,KAAK,EAAE,yBAAyB,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAA;AA6DnG;;;;;GAKG;AAEH,MAAM,WAAW,sBAAsB;IACrC,GAAG,EAAE,gBAAgB,GAAG,IAAI,CAAA;IAC5B,UAAU,EAAE,uBAAuB,GAAG,IAAI,CAAA;IAC1C,2DAA2D;IAC3D,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,SAAS,CAAC,CAAA;IAC1D,cAAc,CAAC,EAAE,uBAAuB,CAAA;IACxC,WAAW,CAAC,EAAE,uBAAuB,CAAA;IACrC,kBAAkB,CAAC,EAAE,CACnB,GAAG,EAAE,yBAAyB,EAC9B,GAAG,EAAE,gBAAgB,EACrB,UAAU,EAAE,uBAAuB,KAChC,SAAS,CAAA;IACd,mBAAmB,CAAC,EAAE,uBAAuB,CAAA;IAC7C,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,KAAK,SAAS,CAAA;IAC3E,sBAAsB,CAAC,EAAE,CACvB,GAAG,EAAE,gBAAgB,EACrB,UAAU,EAAE,MAAM,KACf,OAAO,CAAC,0BAA0B,EAAE,GAAG,IAAI,CAAC,CAAA;IACjD,eAAe,CAAC,EAAE,CAChB,GAAG,EAAE,gBAAgB,EACrB,SAAS,EAAE,WAAW,CAAC,uBAAuB,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,KAClE,IAAI,CAAA;IACT,YAAY,CAAC,EAAE,CACb,GAAG,EAAE,gBAAgB,EACrB,SAAS,EAAE,WAAW,CAAC,uBAAuB,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,EACrE,MAAM,EAAE,WAAW,CAAC,uBAAuB,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,KAC5D,IAAI,CAAA;IACT,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;IAC9E;0DACsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,GAAG,EACH,UAAU,EACV,iBAAyB,EACzB,QAAQ,EACR,UAAU,EACV,cAAc,EACd,WAAW,EACX,kBAAkB,EAClB,mBAAmB,EACnB,kBAAkB,EAClB,sBAAsB,EACtB,eAAe,EACf,YAAY,EACZ,YAAY,EACZ,SAAS,GACV,EAAE,sBAAsB,2CAmRxB"}

package/dist/components/catalog-detail-view.js

@@ -0,0 +1,157 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@voyant-travel/ui/components/tabs";
+import { Loader2 } from "lucide-react";
+import { useMemo } from "react";
+import { useCatalogUiMessagesOrDefault } from "../i18n/index.js";
+import { CabinCard, ShipCard } from "./catalog-detail-cruise-cards.js";
+import { DeparturesTable } from "./catalog-detail-departures.js";
+import { ArrayBadges, AttributeList, DefaultMediaGrid, formatTemplate, humanize, InlineTagsEditor, Section, stringOr, toStringArray, } from "./catalog-detail-parts.js";
+import { MediaGallery } from "./media-gallery.js";
+const HIDDEN_FIELDS = new Set([
+    "id",
+    "name",
+    "description",
+    "shortDescription",
+    "status",
+    "text_embedding",
+    "embedding_model_id",
+]);
+const SYSTEM_FIELD_PREFIXES = ["source.", "seller."];
+const ARRAY_FIELDS = new Set(["tags", "highlights", "regions", "themes", "defaultBookingModes"]);
+/**
+ * Array fields the index emits that don't carry operator-facing value in
+ * the Tags & themes section — either duplicates of a friendlier sibling
+ * (`destinationSlugs` ↔ `regions`/`countries`/`cities`; `categorySlugs`
+ * ↔ `categoryIds`; `tagIds` ↔ `tagLabels`/`tags`) or noise derived from
+ * other rendered fields (`departureMonths` is a roll-up of
+ * `departureDates`). Hidden at render time; the underlying index still
+ * carries them for facets/filters.
+ */
+const HIDDEN_ARRAY_FIELDS = new Set([
+    // Departure surface lives in its own Departures tab now — the
+    // raw date / month chip lists in Tags & themes are redundant.
+    "departureDates",
+    "departureMonths",
+    "destinationIds",
+    "destinationSlugs",
+    // Three category projections cover the same relation: keep the
+    // friendly localized `categories` list, drop the id + slug mirrors.
+    "categoryIds",
+    "categorySlugs",
+    // `tagIds` + `tagLabels` mirror the relational tags table; keep only
+    // the operator-authored `tags` jsonb column.
+    "tagIds",
+    "tagLabels",
+    // Canonical geography id mirrors — the resolved name lists
+    // (`countries`/`regions`/`ports`/`waterways`) carry the display values, so
+    // the raw id columns are noise in the overview.
+    "country_iso",
+    "region_ids",
+    "port_ids",
+    "waterway_ids",
+]);
+/**
+ * Array-field label overrides for the Tags & themes section. Falls
+ * through to `humanize(key)` when not present. Localized variants come
+ * in via `messages.detail.arrayLabels` per locale — this stays as a
+ * stable fallback for any call path that hasn't been wired yet.
+ */
+const ARRAY_LABEL_OVERRIDES = {
+    // i18n-literal-ok: fallback when no localized override is provided
+    categories: "Category",
+};
+/**
+ * The tabbed detail BODY for a catalog hit — overview, itinerary, ship,
+ * cabins/rooms/options, departures/sailings (with live cabin pricing), media,
+ * policies, attributes. Layout-agnostic: it owns no modal/page chrome, so it's
+ * shared by {@link CatalogDetailSheet} (in a Sheet) and the operator's
+ * full-page, new-tab detail route. Enrichment is passed in (the host owns the
+ * fetch) since the host header also needs it.
+ */
+export function CatalogDetailView({ hit, enrichment, enrichmentLoading = false, vertical, formatters, renderBrochure, renderMedia, renderItineraryDay, renderExtraSections, renderSupplierLink, onLoadDeparturePricing, onBookDeparture, onBookOption, onTagsChange, className, }) {
+    const catalogMessages = useCatalogUiMessagesOrDefault().catalogPage;
+    const messages = catalogMessages.detail;
+    // Cruises sell cabin categories, not generic options — label the tab "Cabins".
+    const optionsLabel = vertical === "cruises" ? messages.cabins : messages.options;
+    // In the cruise industry a scheduled departure is a "sailing".
+    const departuresLabel = vertical === "cruises" ? messages.sailings : messages.departures;
+    const fields = hit?.document.fields ?? {};
+    const name = stringOr(fields.name, catalogMessages.fallbacks.detailName);
+    const description = stringOr(enrichment?.description, null) ?? stringOr(fields.description, null);
+    const shortDescription = stringOr(enrichment?.shortDescription, null) ?? stringOr(fields.shortDescription, null);
+    const brochureContent = hit && renderBrochure ? renderBrochure(hit, enrichment) : null;
+    const hasCustomMediaRenderer = hit != null && renderMedia != null;
+    const mediaContent = hit && renderMedia ? renderMedia(hit, enrichment) : null;
+    const shouldRenderMediaSection = hasCustomMediaRenderer
+        ? mediaContent !== null && mediaContent !== undefined && mediaContent !== false
+        : enrichment?.media != null && enrichment.media.length > 0;
+    const extraSections = hit && renderExtraSections ? renderExtraSections(hit, enrichment) : null;
+    const { arrayEntries, attributeEntries, systemEntries } = useMemo(() => {
+        const allEntries = Object.entries(fields).filter(([k]) => !HIDDEN_FIELDS.has(k));
+        const array = [];
+        const attrs = [];
+        const system = [];
+        for (const [k, v] of allEntries) {
+            if (SYSTEM_FIELD_PREFIXES.some((p) => k.startsWith(p)))
+                system.push([k, v]);
+            else if (ARRAY_FIELDS.has(k) || Array.isArray(v)) {
+                if (HIDDEN_ARRAY_FIELDS.has(k))
+                    continue;
+                if (k !== "tags" && Array.isArray(v) && v.length === 0)
+                    continue;
+                array.push([k, v]);
+            }
+            else
+                attrs.push([k, v]);
+        }
+        return { arrayEntries: array, attributeEntries: attrs, systemEntries: system };
+    }, [fields]);
+    const overviewGalleryImages = useMemo(() => {
+        const urls = [];
+        if (enrichment?.heroImageUrl)
+            urls.push(enrichment.heroImageUrl);
+        for (const option of enrichment?.options ?? []) {
+            const cover = option.images?.[0];
+            if (cover)
+                urls.push(cover);
+        }
+        return Array.from(new Set(urls));
+    }, [enrichment]);
+    const reshapedAttributeEntries = (() => {
+        const map = new Map(attributeEntries);
+        const out = [];
+        let didAmount = false;
+        for (const [k, v] of attributeEntries) {
+            if (k === "pax")
+                continue;
+            if (k === "sellCurrency")
+                continue;
+            if (k === "sellAmountCents") {
+                const currency = stringOr(map.get("sellCurrency"), "USD");
+                out.push(["sellAmount", { amountCents: v, currency }]);
+                didAmount = true;
+                continue;
+            }
+            out.push([k, v]);
+        }
+        if (!didAmount && map.has("sellCurrency")) {
+            out.push(["sellCurrency", map.get("sellCurrency")]);
+        }
+        return out;
+    })();
+    const hasItinerary = (enrichment?.itinerary?.length ?? 0) > 0;
+    const hasShip = enrichment?.ship != null;
+    const hasOptions = (enrichment?.options?.length ?? 0) > 0;
+    const hasDepartures = (enrichment?.departures?.length ?? 0) > 0;
+    const hasPolicies = (enrichment?.policies?.length ?? 0) > 0;
+    const hasAttributes = reshapedAttributeEntries.length > 0 || arrayEntries.length > 0 || systemEntries.length > 0;
+    return (_jsxs("div", { className: className, children: [enrichmentLoading && (_jsxs("div", { className: "mb-4 flex items-center gap-2 text-xs text-muted-foreground", children: [_jsx(Loader2, { className: "h-3.5 w-3.5 animate-spin" }), messages.loadingFullContent] })), _jsxs(Tabs, { defaultValue: "overview", className: "gap-4", children: [_jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "overview", children: messages.tabs.overview }), hasItinerary && _jsx(TabsTrigger, { value: "itinerary", children: messages.itinerary }), hasShip && _jsx(TabsTrigger, { value: "ship", children: messages.ship }), hasOptions && _jsx(TabsTrigger, { value: "options", children: optionsLabel }), hasDepartures && _jsx(TabsTrigger, { value: "departures", children: departuresLabel }), shouldRenderMediaSection && _jsx(TabsTrigger, { value: "media", children: messages.media }), hasPolicies && _jsx(TabsTrigger, { value: "policies", children: messages.policies }), hasAttributes && _jsx(TabsTrigger, { value: "attributes", children: messages.attributes })] }), _jsxs(TabsContent, { value: "overview", className: "flex flex-col gap-6", children: [overviewGalleryImages.length > 1 && (_jsx(Section, { title: messages.media, children: _jsx(MediaGallery, { images: overviewGalleryImages, alt: name, className: "w-full max-w-lg", imageClassName: "h-56 w-full" }) })), (shortDescription || description) && (_jsxs(Section, { children: [shortDescription && (_jsx("p", { className: "text-sm font-medium leading-relaxed text-foreground", children: shortDescription })), description && (_jsx("p", { className: "whitespace-pre-line text-sm leading-relaxed text-muted-foreground", children: description }))] })), enrichment?.highlights && enrichment.highlights.length > 0 && (_jsx(Section, { title: messages.highlights, children: _jsx("ul", { className: "ml-4 list-disc space-y-1 text-sm text-muted-foreground", children: enrichment.highlights.map((h) => (_jsx("li", { children: h }, h))) }) })), enrichment?.supplier && (_jsx(Section, { title: messages.supplier, children: _jsx("p", { className: "text-sm text-foreground", children: enrichment.supplier }) })), arrayEntries.length > 0 && (_jsx(Section, { title: messages.tagsThemes, children: _jsx("div", { className: "flex flex-col gap-3", children: arrayEntries.map(([key, value]) => (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx("span", { className: "text-[11px] font-medium uppercase tracking-wider text-muted-foreground", children: ARRAY_LABEL_OVERRIDES[key] ?? humanize(key) }), key === "tags" && hit && onTagsChange ? (_jsx(InlineTagsEditor, { hit: hit, value: toStringArray(value), onChange: onTagsChange, placeholder: messages.tagsInputPlaceholder })) : (_jsx(ArrayBadges, { value: value }))] }, key))) }) })), brochureContent && _jsx(Section, { title: messages.brochure, children: brochureContent }), extraSections] }), hasItinerary && (_jsx(TabsContent, { value: "itinerary", className: "flex flex-col gap-2", children: _jsx("ol", { className: "space-y-2", children: enrichment?.itinerary?.map((d) => (_jsx("li", { children: renderItineraryDay && hit ? (renderItineraryDay(d, hit, enrichment)) : (_jsx(DefaultItineraryDay, { day: d, dayLabel: messages.day })) }, d.dayNumber))) }) })), hasShip && enrichment?.ship && (_jsx(TabsContent, { value: "ship", children: _jsx(ShipCard, { ship: enrichment.ship, messages: messages }) })), hasOptions && (_jsx(TabsContent, { value: "options", children: _jsx("ul", { className: "space-y-3", children: enrichment?.options?.map((o) => (_jsx(CabinCard, { cabin: o, messages: messages }, o.id))) }) })), hasDepartures && enrichment?.departures && (_jsx(TabsContent, { value: "departures", children: _jsx(DeparturesTable, { hit: hit, vertical: vertical, departures: enrichment.departures, options: enrichment?.options ?? [], onLoadDeparturePricing: onLoadDeparturePricing, productSellAmountCents: typeof fields.sellAmountCents === "number"
+                                ? fields.sellAmountCents
+                                : typeof fields.sellAmountCents === "string"
+                                    ? Number(fields.sellAmountCents) || null
+                                    : null, productSellCurrency: typeof fields.sellCurrency === "string" ? fields.sellCurrency : null, onBookDeparture: onBookDeparture, onBookOption: onBookOption, messages: messages }) })), shouldRenderMediaSection && (_jsx(TabsContent, { value: "media", children: mediaContent ?? _jsx(DefaultMediaGrid, { media: enrichment?.media ?? [] }) })), hasPolicies && (_jsx(TabsContent, { value: "policies", children: _jsx("dl", { className: "space-y-2 text-sm", children: enrichment?.policies?.map((p, idx) => (_jsxs("div", { children: [_jsx("dt", { className: "text-xs font-medium uppercase tracking-wider text-muted-foreground", children: p.kind.replace(/_/g, " ") }), _jsx("dd", { className: "mt-0.5 whitespace-pre-line text-muted-foreground", children: p.body })] }, `${p.kind}-${idx}`))) }) })), hasAttributes && (_jsxs(TabsContent, { value: "attributes", className: "flex flex-col gap-6", children: [reshapedAttributeEntries.length > 0 && (_jsx(AttributeList, { entries: reshapedAttributeEntries, formatters: formatters, messages: catalogMessages, renderSupplierLink: renderSupplierLink })), systemEntries.length > 0 && (_jsxs("details", { className: "group rounded-lg border bg-muted/20", children: [_jsx("summary", { className: "cursor-pointer list-none px-4 py-2.5 text-xs font-medium uppercase tracking-wider text-muted-foreground hover:bg-muted/40 group-open:border-b", children: messages.system }), _jsx("div", { className: "px-4 py-3", children: _jsx(AttributeList, { entries: systemEntries, formatters: formatters, messages: catalogMessages }) })] }))] }))] })] }));
+}
+function DefaultItineraryDay({ day, dayLabel, }) {
+    return (_jsxs("div", { className: "flex gap-3 rounded-md border border-border bg-muted/10 p-3 text-sm", children: [day.heroImageUrl ? (_jsx("img", { src: day.heroImageUrl, alt: day.title ?? formatTemplate(dayLabel, { day: day.dayNumber }), className: "h-20 w-28 shrink-0 rounded-md object-cover ring-1 ring-border", loading: "lazy" })) : null, _jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [_jsxs("div", { className: "flex flex-wrap items-baseline gap-2", children: [_jsx("span", { className: "text-xs font-medium text-muted-foreground", children: formatTemplate(dayLabel, { day: day.dayNumber }) }), day.title && _jsx("span", { className: "font-medium", children: day.title }), day.location && _jsxs("span", { className: "text-xs text-muted-foreground", children: ["\u00B7 ", day.location] })] }), day.description && (_jsx("p", { className: "text-xs leading-relaxed text-muted-foreground", children: day.description }))] })] }));
+}

package/dist/components/catalog-enrichment-fetchers.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Back-compat re-export. The catalog detail enrichment client + its
+ * `CatalogDetailEnrichment` view-model moved to the data layer
+ * (`@voyant-travel/catalog-react`); this shim preserves the
+ * `@voyant-travel/catalog-react/ui` import surface.
+ */
+export { __resetEnrichmentFetcherWarnings, type CatalogDeparturePricingRow, type CatalogDetailEnrichment, type CatalogEnrichmentFetchers, type CatalogEnrichmentFetchersOptions, type CatalogSlotAvailability, createCatalogEnrichmentFetchers, } from "../index.js";
+//# sourceMappingURL=catalog-enrichment-fetchers.d.ts.map

package/dist/components/catalog-enrichment-fetchers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog-enrichment-fetchers.d.ts","sourceRoot":"","sources":["../../src/components/catalog-enrichment-fetchers.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EACL,gCAAgC,EAChC,KAAK,0BAA0B,EAC/B,KAAK,uBAAuB,EAC5B,KAAK,yBAAyB,EAC9B,KAAK,gCAAgC,EACrC,KAAK,uBAAuB,EAC5B,+BAA+B,GAChC,MAAM,aAAa,CAAA"}

package/dist/components/catalog-enrichment-fetchers.js

@@ -0,0 +1,7 @@
+/**
+ * Back-compat re-export. The catalog detail enrichment client + its
+ * `CatalogDetailEnrichment` view-model moved to the data layer
+ * (`@voyant-travel/catalog-react`); this shim preserves the
+ * `@voyant-travel/catalog-react/ui` import surface.
+ */
+export { __resetEnrichmentFetcherWarnings, createCatalogEnrichmentFetchers, } from "../index.js";

package/dist/components/catalog-faceted-filter.d.ts

@@ -0,0 +1,30 @@
+import type { CatalogFacetBucket } from "../index.js";
+export interface CatalogFacetedFilterProps {
+    /** Field name (matches the indexer document field). */
+    field: string;
+    /** Display label for the filter trigger. */
+    label: string;
+    /** Live facet buckets — values + counts from the search response. */
+    buckets: CatalogFacetBucket[];
+    /** Currently-selected values for this field. */
+    selected: Array<string | number>;
+    /** Toggle a value on/off. */
+    onToggle: (value: string | number) => void;
+    /** Clear all selections for this field. */
+    onClear: () => void;
+    /**
+     * Optional value formatter. Used to display human-readable labels for
+     * fields that store IDs — e.g. `lineSupplierId` resolved against a
+     * `Map<id, name>`. Falls back to `String(value)` when not provided.
+     */
+    formatValue?: (value: string | number) => string;
+}
+/**
+ * Faceted filter dropdown — modeled after shadcn's data-table-faceted-filter.
+ * Renders as a dashed-border button showing the field label and any active
+ * selections as compact badges. Opens a searchable command list with
+ * checkbox-style selection per bucket; counts come from the live facet
+ * response so the UI never lies about what's available.
+ */
+export declare function CatalogFacetedFilter({ label, buckets, selected, onToggle, onClear, formatValue, }: CatalogFacetedFilterProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=catalog-faceted-filter.d.ts.map

package/dist/components/catalog-faceted-filter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog-faceted-filter.d.ts","sourceRoot":"","sources":["../../src/components/catalog-faceted-filter.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAA;AAErD,MAAM,WAAW,yBAAyB;IACxC,uDAAuD;IACvD,KAAK,EAAE,MAAM,CAAA;IACb,4CAA4C;IAC5C,KAAK,EAAE,MAAM,CAAA;IACb,qEAAqE;IACrE,OAAO,EAAE,kBAAkB,EAAE,CAAA;IAC7B,gDAAgD;IAChD,QAAQ,EAAE,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC,CAAA;IAChC,6BAA6B;IAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAA;IAC1C,2CAA2C;IAC3C,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,MAAM,CAAA;CACjD;AAED;;;;;;GAMG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,KAAK,EACL,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,WAAW,GACZ,EAAE,yBAAyB,2CA0D3B"}

package/dist/components/catalog-faceted-filter.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Button } from "@voyant-travel/ui/components/button";
+import { Checkbox } from "@voyant-travel/ui/components/checkbox";
+import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, } from "@voyant-travel/ui/components/command";
+import { Popover, PopoverContent, PopoverTrigger } from "@voyant-travel/ui/components/popover";
+import { PlusCircle } from "lucide-react";
+import { useCatalogUiMessagesOrDefault } from "../i18n/index.js";
+/**
+ * Faceted filter dropdown — modeled after shadcn's data-table-faceted-filter.
+ * Renders as a dashed-border button showing the field label and any active
+ * selections as compact badges. Opens a searchable command list with
+ * checkbox-style selection per bucket; counts come from the live facet
+ * response so the UI never lies about what's available.
+ */
+export function CatalogFacetedFilter({ label, buckets, selected, onToggle, onClear, formatValue, }) {
+    const messages = useCatalogUiMessagesOrDefault().catalogPage.filtersUi;
+    const selectedSet = new Set(selected);
+    const display = (v) => (formatValue ? formatValue(v) : String(v));
+    return (_jsxs(Popover, { children: [_jsxs(PopoverTrigger, { render: _jsx(Button, { variant: "outline", size: "sm", className: "h-8 gap-2 border-dashed" }), children: [_jsx(PlusCircle, { className: "h-3.5 w-3.5" }), _jsx("span", { children: label }), selected.length > 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: selected.length }))] }), _jsx(PopoverContent, { className: "w-[220px] p-0", align: "start", children: _jsxs(Command, { children: [_jsx(CommandInput, { placeholder: label }), _jsxs(CommandList, { children: [_jsx(CommandEmpty, { children: messages.noResults }), _jsx(CommandGroup, { children: buckets.map((bucket) => {
+                                        const isSelected = selectedSet.has(bucket.value);
+                                        return (_jsxs(CommandItem, { onSelect: () => onToggle(bucket.value), children: [_jsx(Checkbox, { checked: isSelected, tabIndex: -1, "aria-hidden": true, className: "mr-2 pointer-events-none" }), _jsx("span", { className: "flex-1 truncate capitalize", children: display(bucket.value) }), _jsx("span", { className: "ml-2 text-muted-foreground text-xs", children: bucket.count })] }, String(bucket.value)));
+                                    }) }), selected.length > 0 && (_jsxs(_Fragment, { children: [_jsx(CommandSeparator, {}), _jsx(CommandGroup, { children: _jsx(CommandItem, { onSelect: onClear, className: "justify-center text-center text-muted-foreground", children: messages.clearFilter }) })] }))] })] }) })] }));
+}

package/dist/components/catalog-filter-rail.d.ts

@@ -0,0 +1,25 @@
+import type { CatalogFacetBucket } from "../index.js";
+import type { CatalogRangeFilterValue } from "./catalog-range-filter.js";
+import type { CatalogFilterField } from "./catalog-search-page.js";
+export interface CatalogFilterRailProps {
+    /** Visible filter fields (facets with buckets/selection + all ranges). */
+    fields: CatalogFilterField[];
+    /** Live facet buckets keyed by field. */
+    facetGroups: Record<string, CatalogFacetBucket[]>;
+    selectedFacets: Record<string, Array<string | number>>;
+    selectedRanges: Record<string, CatalogRangeFilterValue>;
+    onToggleFacet: (field: string, value: string | number) => void;
+    onClearFacet: (field: string) => void;
+    onSetRange: (field: string, value: CatalogRangeFilterValue | undefined) => void;
+    onClearAll: () => void;
+    hasSelections: boolean;
+}
+/**
+ * Persistent, sectioned left filter rail (Booking.com-style). Facets render
+ * as inline checkbox lists with live counts; numeric ranges render as inline
+ * min/max inputs. Replaces the wrapping chip row for a scannable, always-on
+ * filtering surface. Selection state is owned by the parent
+ * (`CatalogSearchPage`); this component is presentational.
+ */
+export declare function CatalogFilterRail({ fields, facetGroups, selectedFacets, selectedRanges, onToggleFacet, onClearFacet, onSetRange, onClearAll, hasSelections, }: CatalogFilterRailProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=catalog-filter-rail.d.ts.map

package/dist/components/catalog-filter-rail.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog-filter-rail.d.ts","sourceRoot":"","sources":["../../src/components/catalog-filter-rail.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAA;AACrD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAA;AACxE,OAAO,KAAK,EAEV,kBAAkB,EAEnB,MAAM,0BAA0B,CAAA;AAKjC,MAAM,WAAW,sBAAsB;IACrC,0EAA0E;IAC1E,MAAM,EAAE,kBAAkB,EAAE,CAAA;IAC5B,yCAAyC;IACzC,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,EAAE,CAAC,CAAA;IACjD,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC,CAAA;IACtD,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,uBAAuB,CAAC,CAAA;IACvD,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAA;IAC9D,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACrC,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,uBAAuB,GAAG,SAAS,KAAK,IAAI,CAAA;IAC/E,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,aAAa,EAAE,OAAO,CAAA;CACvB;AAED;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,WAAW,EACX,cAAc,EACd,cAAc,EACd,aAAa,EACb,YAAY,EACZ,UAAU,EACV,UAAU,EACV,aAAa,GACd,EAAE,sBAAsB,2CAyDxB"}

package/dist/components/catalog-filter-rail.js

@@ -0,0 +1,88 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from "@voyant-travel/ui/components/button";
+import { Checkbox } from "@voyant-travel/ui/components/checkbox";
+import { Input } from "@voyant-travel/ui/components/input";
+import { Separator } from "@voyant-travel/ui/components/separator";
+import { X } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useCatalogUiMessagesOrDefault } from "../i18n/index.js";
+/** How many facet values show before the "Show all" toggle. */
+const DEFAULT_VISIBLE = 6;
+/**
+ * Persistent, sectioned left filter rail (Booking.com-style). Facets render
+ * as inline checkbox lists with live counts; numeric ranges render as inline
+ * min/max inputs. Replaces the wrapping chip row for a scannable, always-on
+ * filtering surface. Selection state is owned by the parent
+ * (`CatalogSearchPage`); this component is presentational.
+ */
+export function CatalogFilterRail({ fields, facetGroups, selectedFacets, selectedRanges, onToggleFacet, onClearFacet, onSetRange, onClearAll, hasSelections, }) {
+    const messages = useCatalogUiMessagesOrDefault().catalogPage;
+    return (_jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "font-medium text-sm", children: messages.view.filters }), hasSelections && (_jsxs(Button, { variant: "ghost", size: "sm", onClick: onClearAll, className: "h-7 px-2 text-muted-foreground text-xs hover:text-foreground", children: [_jsx(X, { className: "mr-1 h-3 w-3" }), messages.search.clearAll] }))] }), fields.map((field, index) => {
+                const isRange = (field.kind ?? "facet") === "range";
+                return (_jsxs("div", { className: "flex flex-col gap-2", children: [index > 0 && _jsx(Separator, { className: "mb-1" }), _jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsx("span", { className: "font-medium text-muted-foreground text-xs uppercase tracking-wide", children: field.label }), !isRange && (selectedFacets[field.field]?.length ?? 0) > 0 && (_jsx("button", { type: "button", onClick: () => onClearFacet(field.field), className: "text-muted-foreground text-xs hover:text-foreground", children: messages.filtersUi.clear }))] }), isRange ? (_jsx(RangeSection, { field: field, value: selectedRanges[field.field], onChange: (next) => onSetRange(field.field, next) })) : (_jsx(FacetSection, { field: field, buckets: facetGroups[field.field] ?? [], selected: selectedFacets[field.field] ?? [], onToggle: (value) => onToggleFacet(field.field, value) }))] }, field.field));
+            })] }));
+}
+function FacetSection({ field, buckets, selected, onToggle, }) {
+    const messages = useCatalogUiMessagesOrDefault().catalogPage;
+    const [expanded, setExpanded] = useState(false);
+    const selectedSet = new Set(selected);
+    const display = (value) => field.formatValue ? field.formatValue(value) : String(value);
+    if (buckets.length === 0) {
+        return _jsx("span", { className: "text-muted-foreground text-xs", children: messages.filtersUi.noResults });
+    }
+    const ordered = sortBuckets(buckets, field.sortValues);
+    const visible = expanded ? ordered : ordered.slice(0, DEFAULT_VISIBLE);
+    return (_jsxs("div", { className: "flex flex-col gap-1.5", children: [visible.map((bucket) => {
+                const checked = selectedSet.has(bucket.value);
+                return (_jsxs("button", { type: "button", onClick: () => onToggle(bucket.value), className: "flex w-full items-center gap-2 text-left text-sm", children: [_jsx(Checkbox, { checked: checked, "aria-hidden": true, tabIndex: -1, className: "pointer-events-none" }), _jsx("span", { className: "flex-1 truncate capitalize", children: display(bucket.value) }), _jsx("span", { className: "text-muted-foreground text-xs tabular-nums", children: bucket.count })] }, String(bucket.value)));
+            }), buckets.length > DEFAULT_VISIBLE && (_jsx("button", { type: "button", onClick: () => setExpanded((prev) => !prev), className: "self-start text-primary text-xs hover:underline", children: expanded
+                    ? messages.view.showLess
+                    : messages.view.showAll.replace("{count}", String(buckets.length)) }))] }));
+}
+// Order facet buckets. Default keeps the index's count-descending order;
+// "value-desc"/"value-asc" sort numerically when the values parse as numbers
+// (star ratings 5 → 0), else lexicographically.
+function sortBuckets(buckets, sort) {
+    if (!sort || sort === "count")
+        return buckets;
+    const dir = sort === "value-asc" ? 1 : -1;
+    return [...buckets].sort((a, b) => {
+        const an = Number(a.value);
+        const bn = Number(b.value);
+        if (Number.isFinite(an) && Number.isFinite(bn))
+            return (an - bn) * dir;
+        return String(a.value).localeCompare(String(b.value)) * dir;
+    });
+}
+function RangeSection({ field, value, onChange, }) {
+    const messages = useCatalogUiMessagesOrDefault().catalogPage.filtersUi;
+    const [minText, setMinText] = useState(value?.gte != null ? String(value.gte) : "");
+    const [maxText, setMaxText] = useState(value?.lte != null ? String(value.lte) : "");
+    useEffect(() => {
+        setMinText(value?.gte != null ? String(value.gte) : "");
+        setMaxText(value?.lte != null ? String(value.lte) : "");
+    }, [value]);
+    const apply = () => {
+        const gte = parseNumber(minText);
+        const lte = parseNumber(maxText);
+        if (gte == null && lte == null) {
+            onChange(undefined);
+            return;
+        }
+        onChange({ gte: gte ?? undefined, lte: lte ?? undefined });
+    };
+    return (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Input, { type: "number", inputMode: "decimal", step: field.step, placeholder: field.minPlaceholder ?? messages.min, value: minText, onChange: (e) => setMinText(e.target.value), onBlur: apply, onKeyDown: (e) => {
+                    if (e.key === "Enter")
+                        apply();
+                }, className: "h-8" }), _jsx("span", { className: "text-muted-foreground text-xs", children: messages.to }), _jsx(Input, { type: "number", inputMode: "decimal", step: field.step, placeholder: field.maxPlaceholder ?? messages.max, value: maxText, onChange: (e) => setMaxText(e.target.value), onBlur: apply, onKeyDown: (e) => {
+                    if (e.key === "Enter")
+                        apply();
+                }, className: "h-8" })] }));
+}
+function parseNumber(s) {
+    if (!s.trim())
+        return null;
+    const n = Number(s);
+    return Number.isFinite(n) ? n : null;
+}

package/dist/components/catalog-gallery.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Shared catalog gallery + lightbox — the Booking.com-style mosaic and
+ * full-screen viewer used by every catalog detail page (packages, cruises, …)
+ * so they all look identical. Layout/lightbox logic lives here once.
+ */
+export interface GalleryImage {
+    src: string;
+    caption?: string | null;
+}
+export interface GalleryLightboxLabels {
+    close: string;
+    prev: string;
+    next: string;
+}
+export declare function Gallery({ images, photosLabel, onOpen, }: {
+    images: GalleryImage[];
+    photosLabel: string;
+    onOpen: (index: number) => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function GalleryLightbox({ images, index, onIndex, onClose, labels, }: {
+    images: GalleryImage[];
+    index: number;
+    onIndex: (i: number) => void;
+    onClose: () => void;
+    labels: GalleryLightboxLabels;
+}): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=catalog-gallery.d.ts.map