@voyantjs/products-ui 0.101.1 → 0.102.0

package/dist/components/product-detail/product-detail-sections.js

@@ -0,0 +1,143 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useQuery } from "@tanstack/react-query";
+import { describeRRule } from "@voyantjs/availability/rrule";
+import { formatMessage } from "@voyantjs/i18n";
+import { useProductTranslations } from "@voyantjs/products-react";
+import { Badge, Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, ToggleGroup, ToggleGroupItem, } from "@voyantjs/ui/components";
+import { Separator } from "@voyantjs/ui/components/separator";
+import { CalendarRange, DollarSign, Download, FileText, MoreHorizontal, Pencil, Plus, RefreshCw, Trash2, } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useProductDetailApi, useProductDetailMessages, useProductLocale, } from "./host.js";
+import { formatAmount, formatCapacityLabel, formatDuration, formatSlotDate, formatSlotTime, getDepartureStatusLabel, getProductBookingModeLabel, slotStatusVariant, } from "./product-detail-shared.js";
+import { ProductMediaGallery } from "./product-media-gallery.js";
+export function Section({ title, actions, children, contentClassName, }) {
+    return (_jsxs("div", { className: "rounded-lg border bg-card text-card-foreground shadow-sm", children: [_jsxs("div", { className: "flex items-center justify-between px-6 py-4", children: [_jsx("h2", { className: "font-semibold leading-none tracking-tight", children: title }), actions] }), _jsx(Separator, {}), _jsx("div", { className: contentClassName ?? "px-6 py-4", children: children })] }));
+}
+export function DetailRow({ label, value }) {
+    return (_jsxs("div", { className: "flex items-center justify-between py-3 text-sm [&:not(:last-child)]:border-b", children: [_jsx("span", { className: "text-muted-foreground", children: label }), _jsx("span", { children: value })] }));
+}
+export function ActionMenu({ children }) {
+    return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 text-muted-foreground", children: _jsx(MoreHorizontal, { className: "h-4 w-4" }) }) }), _jsx(DropdownMenuContent, { align: "end", children: children })] }));
+}
+export function EmptyState({ message }) {
+    return _jsx("p", { className: "py-6 text-center text-sm text-muted-foreground", children: message });
+}
+async function getProductStartingFromCents(api, productId) {
+    const rules = await api.get(`/v1/pricing/option-price-rules?productId=${encodeURIComponent(productId)}&limit=100&active=true`);
+    const ruleIds = rules.data.filter((rule) => rule.active).map((rule) => rule.id);
+    if (ruleIds.length === 0)
+        return null;
+    const unitPriceResponses = await Promise.all(ruleIds.map((ruleId) => api.get(`/v1/pricing/option-unit-price-rules?optionPriceRuleId=${encodeURIComponent(ruleId)}&limit=100&active=true`)));
+    const prices = unitPriceResponses
+        .flatMap((response) => response.data)
+        .filter((rule) => rule.active)
+        .map((rule) => rule.sellAmountCents)
+        .filter((amount) => amount != null && amount > 0);
+    return prices.length > 0 ? Math.min(...prices) : null;
+}
+// Legacy CMS imports occasionally store rich HTML in the plain-text description
+// field. Detect it so we can render it as markup instead of dumping raw tags.
+function looksLikeHtml(value) {
+    return /<\/?[a-z][\s\S]*>/i.test(value);
+}
+export function ProductDetailsSection({ product, onEdit, }) {
+    const api = useProductDetailApi();
+    const messages = useProductDetailMessages();
+    const productMessages = messages.products.core;
+    const resolvedLocale = useProductLocale();
+    const startingFromQuery = useQuery({
+        queryKey: ["product-starting-from", product.id],
+        queryFn: () => getProductStartingFromCents(api, product.id),
+    });
+    const startingFromCents = startingFromQuery.data ?? null;
+    const usesOptionUnitPricing = startingFromQuery.isPending || startingFromCents != null;
+    const translationsQuery = useProductTranslations(product.id, { limit: 100 });
+    const translations = translationsQuery.data?.data ?? [];
+    const [selectedLanguageTag, setSelectedLanguageTag] = useState("");
+    // Default the toggle to the operator's current locale (or its base language),
+    // falling back to the first available translation.
+    useEffect(() => {
+        if (translations.length === 0)
+            return;
+        if (translations.some((translation) => translation.languageTag === selectedLanguageTag))
+            return;
+        const baseLocale = resolvedLocale.toLowerCase().split("-")[0];
+        const preferred = translations.find((translation) => translation.languageTag.toLowerCase() === resolvedLocale.toLowerCase()) ??
+            translations.find((translation) => translation.languageTag.toLowerCase().split("-")[0] === baseLocale) ??
+            translations[0];
+        setSelectedLanguageTag(preferred?.languageTag ?? "");
+    }, [translations, selectedLanguageTag, resolvedLocale]);
+    const selectedTranslation = translations.find((translation) => translation.languageTag === selectedLanguageTag) ?? null;
+    const description = selectedTranslation?.description ?? product.description ?? null;
+    return (_jsxs(Section, { title: productMessages.detailsTitle, actions: _jsxs("div", { className: "flex items-center gap-2", children: [translations.length > 0 ? (_jsx(ToggleGroup, { value: selectedLanguageTag ? [selectedLanguageTag] : [], onValueChange: (values) => {
+                        const next = values[values.length - 1];
+                        if (next)
+                            setSelectedLanguageTag(next);
+                    }, variant: "outline", size: "sm", "aria-label": productMessages.descriptionLanguageLabel, children: translations.map((translation) => (_jsx(ToggleGroupItem, { value: translation.languageTag, className: "px-2 text-xs uppercase", children: translation.languageTag }, translation.id))) })) : null, _jsx(ActionMenu, { children: _jsxs(DropdownMenuItem, { onClick: onEdit, children: [_jsx(Pencil, { className: "h-4 w-4" }), productMessages.edit] }) })] }), children: [description ? (looksLikeHtml(description) ? (_jsx("div", { className: "border-b pb-4 text-sm leading-relaxed text-muted-foreground [&_a]:font-medium [&_a]:text-foreground [&_a]:underline [&_em]:italic [&_h2]:mt-4 [&_h2]:mb-1.5 [&_h2]:text-base [&_h2]:font-semibold [&_h2]:text-foreground [&_h3]:mt-4 [&_h3]:mb-1.5 [&_h3]:text-sm [&_h3]:font-semibold [&_h3]:text-foreground [&_li]:mb-0.5 [&_ol]:mb-2 [&_ol]:list-decimal [&_ol]:pl-5 [&_p]:mb-2 [&_p:last-child]:mb-0 [&_strong]:font-semibold [&_strong]:text-foreground [&_ul]:mb-2 [&_ul]:list-disc [&_ul]:pl-5", 
+                // biome-ignore lint/security/noDangerouslySetInnerHtml: operator-authored localized rich text from the products module
+                dangerouslySetInnerHTML: { __html: description } })) : (_jsx("div", { className: "border-b pb-3 text-sm whitespace-pre-line text-muted-foreground", children: description }))) : null, usesOptionUnitPricing ? (_jsx(DetailRow, { label: productMessages.startingFromLabel, value: _jsx("span", { className: "font-mono", children: startingFromCents != null
+                        ? formatAmount(startingFromCents, product.sellCurrency)
+                        : productMessages.noValue }) })) : null, !usesOptionUnitPricing && product.sellAmountCents != null ? (_jsx(DetailRow, { label: productMessages.sellLabel, value: _jsx("span", { className: "font-mono", children: formatAmount(product.sellAmountCents, product.sellCurrency) }) })) : null, !usesOptionUnitPricing && product.costAmountCents != null ? (_jsx(DetailRow, { label: productMessages.costLabel, value: _jsx("span", { className: "font-mono", children: formatAmount(product.costAmountCents, product.sellCurrency) }) })) : null] }));
+}
+export function ProductDeparturesSection({ slots, itineraryNameById, slotIdsWithOverrides, onCreate, onEdit, onOverridePrice, onManageAvailability, onDelete, }) {
+    const messages = useProductDetailMessages();
+    const productMessages = messages.products.core;
+    return (_jsx(Section, { title: productMessages.departuresTitle, actions: _jsx(ActionMenu, { children: _jsxs(DropdownMenuItem, { onClick: onCreate, children: [_jsx(Plus, { className: "h-4 w-4" }), productMessages.newDeparture] }) }), contentClassName: "", children: slots.length === 0 ? (_jsx(EmptyState, { message: productMessages.departuresEmpty })) : (_jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { children: _jsxs("tr", { className: "border-b text-muted-foreground", children: [_jsx("th", { className: "py-2.5 pl-6 pr-3 text-left font-medium", children: productMessages.departureStartColumn }), _jsx("th", { className: "px-3 py-2.5 text-left font-medium", children: productMessages.departureEndColumn }), _jsx("th", { className: "px-3 py-2.5 text-left font-medium", children: "Itinerary" }), _jsx("th", { className: "px-3 py-2.5 text-left font-medium", children: productMessages.departureDurationColumn }), _jsx("th", { className: "px-3 py-2.5 text-left font-medium", children: productMessages.departureStatusColumn }), _jsx("th", { className: "px-3 py-2.5 text-left font-medium", children: productMessages.departureCapacityColumn }), _jsx("th", { className: "w-10 px-3 py-2.5" })] }) }), _jsx("tbody", { children: slots.map((slot) => (_jsxs("tr", { className: "border-b last:border-b-0", children: [_jsxs("td", { className: "py-2.5 pl-6 pr-3", children: [_jsx("div", { className: "font-mono text-xs", children: slot.dateLocal }), _jsx("div", { className: "text-xs text-muted-foreground", children: formatSlotTime(slot.startsAt) })] }), _jsx("td", { className: "px-3 py-2.5", children: slot.endsAt ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "font-mono text-xs", children: formatSlotDate(slot.endsAt) }), _jsx("div", { className: "text-xs text-muted-foreground", children: formatSlotTime(slot.endsAt) })] })) : (_jsx("span", { className: "text-muted-foreground", children: productMessages.noValue })) }), _jsx("td", { className: "px-3 py-2.5 text-xs", children: slot.itineraryId
+                                    ? (itineraryNameById.get(slot.itineraryId) ??
+                                        messages.products.operations.itineraries.customOverride)
+                                    : messages.products.operations.itineraries.defaultBadge }), _jsx("td", { className: "px-3 py-2.5 text-xs", children: formatDuration(slot) }), _jsx("td", { className: "px-3 py-2.5", children: _jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx(Badge, { variant: slotStatusVariant[slot.status], className: "text-xs", children: getDepartureStatusLabel(slot.status, messages) }), slotIdsWithOverrides?.has(slot.id) ? (_jsx(Badge, { variant: "outline", className: "text-xs", children: productMessages.departureOverrideBadge })) : null] }) }), _jsx("td", { className: "px-3 py-2.5 font-mono text-xs", children: formatCapacityLabel(slot, messages) }), _jsx("td", { className: "px-3 py-2.5", children: _jsxs(ActionMenu, { children: [_jsxs(DropdownMenuItem, { onClick: () => onEdit(slot), children: [_jsx(Pencil, { className: "h-4 w-4" }), productMessages.edit] }), onManageAvailability ? (_jsxs(DropdownMenuItem, { onClick: () => onManageAvailability(slot), children: [_jsx(CalendarRange, { className: "h-4 w-4" }), productMessages.departureManageAvailability] })) : null, onOverridePrice ? (_jsxs(DropdownMenuItem, { onClick: () => onOverridePrice(slot), children: [_jsx(DollarSign, { className: "h-4 w-4" }), productMessages.departureOverridePricing] })) : null, _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { variant: "destructive", onClick: () => onDelete(slot.id), children: [_jsx(Trash2, { className: "h-4 w-4" }), productMessages.delete] })] }) })] }, slot.id))) })] })) }));
+}
+export function ProductSchedulesSection({ rules, onCreate, onEdit, onDelete, }) {
+    const messages = useProductDetailMessages();
+    const productMessages = messages.products.core;
+    return (_jsx(Section, { title: productMessages.schedulesTitle, actions: _jsx(ActionMenu, { children: _jsxs(DropdownMenuItem, { onClick: onCreate, children: [_jsx(Plus, { className: "h-4 w-4" }), productMessages.newSchedule] }) }), children: rules.length === 0 ? (_jsx(EmptyState, { message: productMessages.schedulesEmpty })) : (_jsx("div", { className: "flex flex-col divide-y", children: rules.map((rule) => (_jsxs("div", { className: "flex items-center justify-between py-3 first:pt-0 last:pb-0", children: [_jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-sm font-medium", children: describeRRule(rule.recurrenceRule) }), !rule.active ? (_jsx(Badge, { variant: "outline", className: "text-xs", children: productMessages.inactiveBadge })) : null] }), _jsx("p", { className: "mt-0.5 text-xs text-muted-foreground", children: formatMessage(productMessages.scheduleSummary, {
+                                    maxCapacity: rule.maxCapacity,
+                                    timezone: rule.timezone,
+                                    cutoff: rule.cutoffMinutes != null
+                                        ? formatMessage(productMessages.scheduleCutoffSuffix, {
+                                            minutes: rule.cutoffMinutes,
+                                        })
+                                        : "",
+                                }) })] }), _jsxs(ActionMenu, { children: [_jsxs(DropdownMenuItem, { onClick: () => onEdit(rule), children: [_jsx(Pencil, { className: "h-4 w-4" }), productMessages.edit] }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { variant: "destructive", onClick: () => onDelete(rule.id), children: [_jsx(Trash2, { className: "h-4 w-4" }), productMessages.delete] })] })] }, rule.id))) })) }));
+}
+export function ProductChannelsSection({ allChannels, mappings, onAddChannel, onRemoveChannel, }) {
+    const messages = useProductDetailMessages();
+    const productMessages = messages.products.core;
+    const assignedChannelIds = new Set(mappings.map((mapping) => mapping.channelId));
+    const assignedChannels = allChannels.filter((channel) => assignedChannelIds.has(channel.id));
+    const unassignedChannels = allChannels.filter((channel) => !assignedChannelIds.has(channel.id) && channel.status === "active");
+    return (_jsx(Section, { title: productMessages.channelsTitle, children: _jsxs("div", { className: "flex flex-col gap-3", children: [assignedChannels.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: productMessages.channelsEmpty })) : (_jsx("div", { className: "flex flex-col divide-y", children: assignedChannels.map((channel) => {
+                        const mapping = mappings.find((entry) => entry.channelId === channel.id);
+                        return (_jsxs("div", { className: "flex items-center justify-between py-2 first:pt-0 last:pb-0", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-sm", children: channel.name }), _jsx(Badge, { variant: "outline", className: "text-[10px] capitalize", children: channel.kind.replace("_", " ") })] }), mapping ? (_jsx(Button, { variant: "ghost", size: "icon", className: "h-7 w-7 text-muted-foreground hover:text-destructive", onClick: () => onRemoveChannel(mapping.id), children: _jsx(Trash2, { className: "h-3.5 w-3.5" }) })) : null] }, channel.id));
+                    }) })), unassignedChannels.length > 0 ? (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", size: "sm", className: "w-full", children: [_jsx(Plus, { className: "mr-1.5 h-3.5 w-3.5" }), productMessages.addChannel] }) }), _jsx(DropdownMenuContent, { align: "end", className: "w-56", children: unassignedChannels.map((channel) => (_jsxs(DropdownMenuItem, { onClick: () => onAddChannel(channel.id), children: [channel.name, _jsx("span", { className: "ml-auto text-xs capitalize text-muted-foreground", children: channel.kind.replace("_", " ") })] }, channel.id))) })] })) : null, allChannels.length === 0 ? (_jsxs("p", { className: "text-xs text-muted-foreground", children: [productMessages.noChannelsDefined, " ", _jsx("a", { href: "/settings/channels", className: "underline", children: productMessages.createChannelsInSettings })] })) : null] }) }));
+}
+export function ProductOrganizeSection({ product, onEdit, }) {
+    const api = useProductDetailApi();
+    const messages = useProductDetailMessages();
+    const productMessages = messages.products.core;
+    const taxClassQuery = useQuery({
+        queryKey: ["tax-class", product.taxClassId],
+        enabled: !!product.taxClassId,
+        queryFn: () => api.get(`/v1/admin/finance/tax-classes/${product.taxClassId}`),
+    });
+    return (_jsxs(Section, { title: productMessages.organizeTitle, actions: _jsx(ActionMenu, { children: _jsxs(DropdownMenuItem, { onClick: onEdit, children: [_jsx(Pencil, { className: "h-4 w-4" }), productMessages.edit] }) }), children: [_jsx(DetailRow, { label: productMessages.tagsLabel, value: product.tags.length > 0 ? (_jsx("div", { className: "flex flex-wrap justify-end gap-1", children: product.tags.map((tag) => (_jsx(Badge, { variant: "secondary", className: "text-xs", children: tag }, tag))) })) : (_jsx("span", { className: "text-muted-foreground", children: productMessages.noValue })) }), _jsx(DetailRow, { label: productMessages.typeLabel, value: _jsx("span", { children: getProductBookingModeLabel(product.bookingMode, messages) }) }), _jsx(DetailRow, { label: productMessages.taxClassLabel, value: taxClassQuery.data?.data.label ? (_jsx("span", { children: taxClassQuery.data.data.label })) : (_jsx("span", { className: "text-muted-foreground", children: productMessages.taxClassNone })) })] }));
+}
+export function ProductBrochureSection({ brochure, isGenerating, onGenerate, }) {
+    const messages = useProductDetailMessages();
+    const productMessages = messages.products.core;
+    return (_jsx(Section, { title: productMessages.brochureTitle, children: _jsxs("div", { className: "flex flex-col gap-3", children: [brochure ? (_jsxs("div", { className: "flex items-start gap-3 rounded-md border bg-muted/20 p-3", children: [_jsx("div", { className: "mt-0.5 rounded-md bg-background p-2 text-muted-foreground", children: _jsx(FileText, { className: "h-4 w-4" }) }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate text-sm font-medium", children: brochure.name }), _jsx("p", { className: "mt-0.5 text-xs text-muted-foreground", children: formatMessage(productMessages.brochureMeta, {
+                                        version: brochure.brochureVersion ?? 1,
+                                        size: formatFileSize(brochure.fileSize),
+                                    }) })] })] })) : (_jsx("p", { className: "text-sm text-muted-foreground", children: productMessages.brochureEmpty })), _jsxs("div", { className: "flex gap-2", children: [brochure ? (_jsx("a", { href: brochure.url, target: "_blank", rel: "noreferrer", className: "flex-1", children: _jsxs(Button, { variant: "outline", size: "sm", className: "w-full", children: [_jsx(Download, { className: "mr-1.5 h-3.5 w-3.5" }), productMessages.downloadBrochure] }) })) : null, _jsxs(Button, { variant: brochure ? "secondary" : "default", size: "sm", className: "flex-1", disabled: isGenerating, onClick: onGenerate, children: [_jsx(RefreshCw, { className: `mr-1.5 h-3.5 w-3.5 ${isGenerating ? "animate-spin" : ""}` }), brochure ? productMessages.regenerateBrochure : productMessages.generateBrochure] })] }), _jsx("p", { className: "text-xs text-muted-foreground", children: productMessages.brochureSizeHint })] }) }));
+}
+export function ProductMediaSection({ productId, media, isUploading, onUpload, onSetCover, onDelete, }) {
+    const messages = useProductDetailMessages();
+    return (_jsx(Section, { title: messages.products.core.mediaTitle, children: _jsx("div", { className: "flex flex-col gap-4", children: _jsx(ProductMediaGallery, { productId: productId, media: media, isUploading: isUploading, onUpload: onUpload, onSetCover: onSetCover, onDelete: onDelete }) }) }));
+}
+function formatFileSize(value) {
+    if (value == null)
+        return "-";
+    if (value < 1024 * 1024)
+        return `${Math.max(1, Math.round(value / 1024))} KB`;
+    return `${(value / (1024 * 1024)).toFixed(1)} MB`;
+}

package/dist/components/product-detail/product-detail-shared.d.ts

@@ -0,0 +1,264 @@
+import type { ProductRecord } from "@voyantjs/products-react";
+import type { ProductDetailApi, ProductMessagesRoot } from "./host.js";
+import type { DepartureSlot } from "./product-departure-dialog.js";
+import type { AvailabilityRule } from "./product-schedule-dialog.js";
+export type { AvailabilityRule, DepartureSlot, ProductRecord };
+export type ProductDay = {
+    id: string;
+    itineraryId: string;
+    dayNumber: number;
+    title: string | null;
+    description: string | null;
+    location: string | null;
+    createdAt: string;
+    updatedAt: string;
+};
+export type DayService = {
+    id: string;
+    dayId: string;
+    supplierServiceId: string | null;
+    serviceType: "accommodation" | "transfer" | "experience" | "guide" | "meal" | "other";
+    name: string;
+    description: string | null;
+    countryCode: string | null;
+    costCurrency: string;
+    costAmountCents: number;
+    quantity: number;
+    sortOrder: number | null;
+    notes: string | null;
+    createdAt: string;
+};
+export type ChannelInfo = {
+    id: string;
+    name: string;
+    kind: string;
+    status: string;
+};
+export type ChannelProductMapping = {
+    id: string;
+    channelId: string;
+    productId: string;
+    active: boolean;
+};
+export type ProductMediaItem = {
+    id: string;
+    productId: string;
+    dayId: string | null;
+    mediaType: "image" | "video" | "document";
+    name: string;
+    url: string;
+    storageKey: string | null;
+    mimeType: string | null;
+    fileSize: number | null;
+    altText: string | null;
+    sortOrder: number;
+    isCover: boolean;
+    isBrochure: boolean;
+    isBrochureCurrent: boolean;
+    brochureVersion: number | null;
+    createdAt: string;
+    updatedAt: string;
+};
+export declare function getProductDaysQueryOptions(api: ProductDetailApi, id: string): import("@tanstack/react-query").OmitKeyof<import("@tanstack/react-query").UseQueryOptions<{
+    data: ProductDay[];
+}, Error, {
+    data: ProductDay[];
+}, string[]>, "queryFn"> & {
+    queryFn?: import("@tanstack/react-query").QueryFunction<{
+        data: ProductDay[];
+    }, string[], never> | undefined;
+} & {
+    queryKey: string[] & {
+        [dataTagSymbol]: {
+            data: ProductDay[];
+        };
+        [dataTagErrorSymbol]: Error;
+    };
+};
+export declare function getProductSlotsQueryOptions(api: ProductDetailApi, id: string): import("@tanstack/react-query").OmitKeyof<import("@tanstack/react-query").UseQueryOptions<{
+    data: DepartureSlot[];
+}, Error, {
+    data: DepartureSlot[];
+}, string[]>, "queryFn"> & {
+    queryFn?: import("@tanstack/react-query").QueryFunction<{
+        data: DepartureSlot[];
+    }, string[], never> | undefined;
+} & {
+    queryKey: string[] & {
+        [dataTagSymbol]: {
+            data: DepartureSlot[];
+        };
+        [dataTagErrorSymbol]: Error;
+    };
+};
+export declare function getProductRulesQueryOptions(api: ProductDetailApi, id: string): import("@tanstack/react-query").OmitKeyof<import("@tanstack/react-query").UseQueryOptions<{
+    data: AvailabilityRule[];
+}, Error, {
+    data: AvailabilityRule[];
+}, string[]>, "queryFn"> & {
+    queryFn?: import("@tanstack/react-query").QueryFunction<{
+        data: AvailabilityRule[];
+    }, string[], never> | undefined;
+} & {
+    queryKey: string[] & {
+        [dataTagSymbol]: {
+            data: AvailabilityRule[];
+        };
+        [dataTagErrorSymbol]: Error;
+    };
+};
+export declare function getProductDayServicesQueryOptions(api: ProductDetailApi, productId: string, dayId: string): import("@tanstack/react-query").OmitKeyof<import("@tanstack/react-query").UseQueryOptions<{
+    data: DayService[];
+}, Error, {
+    data: DayService[];
+}, string[]>, "queryFn"> & {
+    queryFn?: import("@tanstack/react-query").QueryFunction<{
+        data: DayService[];
+    }, string[], never> | undefined;
+} & {
+    queryKey: string[] & {
+        [dataTagSymbol]: {
+            data: DayService[];
+        };
+        [dataTagErrorSymbol]: Error;
+    };
+};
+export declare function getChannelsQueryOptions(api: ProductDetailApi): import("@tanstack/react-query").OmitKeyof<import("@tanstack/react-query").UseQueryOptions<{
+    data: ChannelInfo[];
+}, Error, {
+    data: ChannelInfo[];
+}, string[]>, "queryFn"> & {
+    queryFn?: import("@tanstack/react-query").QueryFunction<{
+        data: ChannelInfo[];
+    }, string[], never> | undefined;
+} & {
+    queryKey: string[] & {
+        [dataTagSymbol]: {
+            data: ChannelInfo[];
+        };
+        [dataTagErrorSymbol]: Error;
+    };
+};
+export declare function getProductChannelMappingsQueryOptions(api: ProductDetailApi, id: string): import("@tanstack/react-query").OmitKeyof<import("@tanstack/react-query").UseQueryOptions<{
+    data: ChannelProductMapping[];
+}, Error, {
+    data: ChannelProductMapping[];
+}, string[]>, "queryFn"> & {
+    queryFn?: import("@tanstack/react-query").QueryFunction<{
+        data: ChannelProductMapping[];
+    }, string[], never> | undefined;
+} & {
+    queryKey: string[] & {
+        [dataTagSymbol]: {
+            data: ChannelProductMapping[];
+        };
+        [dataTagErrorSymbol]: Error;
+    };
+};
+export declare function getProductMediaQueryOptions(api: ProductDetailApi, id: string): import("@tanstack/react-query").OmitKeyof<import("@tanstack/react-query").UseQueryOptions<{
+    data: ProductMediaItem[];
+    total: number;
+}, Error, {
+    data: ProductMediaItem[];
+    total: number;
+}, string[]>, "queryFn"> & {
+    queryFn?: import("@tanstack/react-query").QueryFunction<{
+        data: ProductMediaItem[];
+        total: number;
+    }, string[], never> | undefined;
+} & {
+    queryKey: string[] & {
+        [dataTagSymbol]: {
+            data: ProductMediaItem[];
+            total: number;
+        };
+        [dataTagErrorSymbol]: Error;
+    };
+};
+export declare function getProductDayMediaQueryOptions(api: ProductDetailApi, productId: string, dayId: string): import("@tanstack/react-query").OmitKeyof<import("@tanstack/react-query").UseQueryOptions<{
+    data: ProductMediaItem[];
+    total: number;
+}, Error, {
+    data: ProductMediaItem[];
+    total: number;
+}, string[]>, "queryFn"> & {
+    queryFn?: import("@tanstack/react-query").QueryFunction<{
+        data: ProductMediaItem[];
+        total: number;
+    }, string[], never> | undefined;
+} & {
+    queryKey: string[] & {
+        [dataTagSymbol]: {
+            data: ProductMediaItem[];
+            total: number;
+        };
+        [dataTagErrorSymbol]: Error;
+    };
+};
+export declare const statusVariant: Record<string, "default" | "secondary" | "outline" | "destructive">;
+export declare const slotStatusVariant: Record<DepartureSlot["status"], "default" | "secondary" | "outline" | "destructive">;
+export declare function formatAmount(cents: number | null, currency: string): string;
+export declare function formatMargin(percent: number | null): string;
+export declare function formatSlotTime(iso: string): string;
+export declare function formatSlotDate(iso: string): string;
+export declare function formatDuration(slot: DepartureSlot): string;
+export declare function getProductStatusLabel(status: ProductRecord["status"], messages: ProductMessagesRoot): string;
+export declare function getProductBookingModeLabel(bookingMode: ProductRecord["bookingMode"], messages: ProductMessagesRoot): string;
+export declare function getDepartureStatusLabel(status: DepartureSlot["status"], messages: ProductMessagesRoot): string;
+export declare function formatCapacityLabel(slot: DepartureSlot, messages: ProductMessagesRoot): string;
+export interface ProductSourcedContentResponse {
+    data: {
+        content: {
+            product: {
+                id: string;
+                name: string;
+                description?: string | null;
+                highlights?: string[];
+                hero_image_url?: string | null;
+                duration_days?: number | null;
+                sell_currency?: string | null;
+                supplier?: string | null;
+                country?: string | null;
+            };
+            options: Array<{
+                id: string;
+                name: string;
+                description?: string | null;
+            }>;
+            days: Array<{
+                day_number: number;
+                title?: string | null;
+                description?: string | null;
+                location?: string | null;
+                hero_image_url?: string | null;
+            }>;
+            media: Array<{
+                url: string;
+                type: string;
+                caption?: string | null;
+            }>;
+            policies: Array<{
+                kind: string;
+                body: string;
+            }>;
+            departures?: Array<{
+                id: string;
+                starts_at: string;
+                ends_at?: string | null;
+                status?: string | null;
+                capacity?: number | null;
+                remaining?: number | null;
+                lowest_price_cents?: number | null;
+                currency?: string | null;
+                note?: string | null;
+            }>;
+        };
+        served_locale: string;
+        match_kind: "exact" | "language_match" | "fallback_chain" | "any";
+        source: "sourced-cache" | "sourced-fresh" | "synthesized" | "owned";
+        served_stale: boolean;
+        synthesized: boolean;
+        machine_translated: boolean;
+    };
+}
+//# sourceMappingURL=product-detail-shared.d.ts.map

package/dist/components/product-detail/product-detail-shared.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-detail-shared.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/product-detail-shared.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAA;AAC7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,WAAW,CAAA;AAEtE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAA;AAClE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAA;AAEpE,YAAY,EAAE,gBAAgB,EAAE,aAAa,EAAE,aAAa,EAAE,CAAA;AAE9D,MAAM,MAAM,UAAU,GAAG;IACvB,EAAE,EAAE,MAAM,CAAA;IACV,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;IACjB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,WAAW,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAA;IACvB,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,MAAM,MAAM,UAAU,GAAG;IACvB,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,iBAAiB,EAAE,MAAM,GAAG,IAAI,CAAA;IAChC,WAAW,EAAE,eAAe,GAAG,UAAU,GAAG,YAAY,GAAG,OAAO,GAAG,MAAM,GAAG,OAAO,CAAA;IACrF,IAAI,EAAE,MAAM,CAAA;IACZ,WAAW,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B,WAAW,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B,YAAY,EAAE,MAAM,CAAA;IACpB,eAAe,EAAE,MAAM,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;IACxB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACxB,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;CACf,CAAA;AAED,MAAM,MAAM,qBAAqB,GAAG;IAClC,EAAE,EAAE,MAAM,CAAA;IACV,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,EAAE,EAAE,MAAM,CAAA;IACV,SAAS,EAAE,MAAM,CAAA;IACjB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,SAAS,EAAE,OAAO,GAAG,OAAO,GAAG,UAAU,CAAA;IACzC,IAAI,EAAE,MAAM,CAAA;IACZ,GAAG,EAAE,MAAM,CAAA;IACX,UAAU,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAA;IACvB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAA;IACvB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAA;IACtB,SAAS,EAAE,MAAM,CAAA;IACjB,OAAO,EAAE,OAAO,CAAA;IAChB,UAAU,EAAE,OAAO,CAAA;IACnB,iBAAiB,EAAE,OAAO,CAAA;IAC1B,eAAe,EAAE,MAAM,GAAG,IAAI,CAAA;IAC9B,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,wBAAgB,0BAA0B,CAAC,GAAG,EAAE,gBAAgB,EAAE,EAAE,EAAE,MAAM;UAGzC,UAAU,EAAE;;UAAZ,UAAU,EAAE;;;cAAZ,UAAU,EAAE;;;;;kBAAZ,UAAU,EAAE;;;;EAE9C;AAED,wBAAgB,2BAA2B,CAAC,GAAG,EAAE,gBAAgB,EAAE,EAAE,EAAE,MAAM;UAIvD,aAAa,EAAE;;UAAf,aAAa,EAAE;;;cAAf,aAAa,EAAE;;;;;kBAAf,aAAa,EAAE;;;;EAEpC;AAED,wBAAgB,2BAA2B,CAAC,GAAG,EAAE,gBAAgB,EAAE,EAAE,EAAE,MAAM;UAIvD,gBAAgB,EAAE;;UAAlB,gBAAgB,EAAE;;;cAAlB,gBAAgB,EAAE;;;;;kBAAlB,gBAAgB,EAAE;;;;EAEvC;AAED,wBAAgB,iCAAiC,CAC/C,GAAG,EAAE,gBAAgB,EACrB,SAAS,EAAE,MAAM,EACjB,KAAK,EAAE,MAAM;UAKO,UAAU,EAAE;;UAAZ,UAAU,EAAE;;;cAAZ,UAAU,EAAE;;;;;kBAAZ,UAAU,EAAE;;;;EAEjC;AAED,wBAAgB,uBAAuB,CAAC,GAAG,EAAE,gBAAgB;UAG1B,WAAW,EAAE;;UAAb,WAAW,EAAE;;;cAAb,WAAW,EAAE;;;;;kBAAb,WAAW,EAAE;;;;EAE/C;AAED,wBAAgB,qCAAqC,CAAC,GAAG,EAAE,gBAAgB,EAAE,EAAE,EAAE,MAAM;UAIjE,qBAAqB,EAAE;;UAAvB,qBAAqB,EAAE;;;cAAvB,qBAAqB,EAAE;;;;;kBAAvB,qBAAqB,EAAE;;;;EAI5C;AAED,wBAAgB,2BAA2B,CAAC,GAAG,EAAE,gBAAgB,EAAE,EAAE,EAAE,MAAM;UAIvD,gBAAgB,EAAE;WAAS,MAAM;;UAAjC,gBAAgB,EAAE;WAAS,MAAM;;;cAAjC,gBAAgB,EAAE;eAAS,MAAM;;;;;kBAAjC,gBAAgB,EAAE;mBAAS,MAAM;;;;EAEtD;AAED,wBAAgB,8BAA8B,CAC5C,GAAG,EAAE,gBAAgB,EACrB,SAAS,EAAE,MAAM,EACjB,KAAK,EAAE,MAAM;UAKO,gBAAgB,EAAE;WAAS,MAAM;;UAAjC,gBAAgB,EAAE;WAAS,MAAM;;;cAAjC,gBAAgB,EAAE;eAAS,MAAM;;;;;kBAAjC,gBAAgB,EAAE;mBAAS,MAAM;;;;EAItD;AAED,eAAO,MAAM,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,aAAa,CAI7F,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,MAAM,CACpC,aAAa,CAAC,QAAQ,CAAC,EACvB,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,aAAa,CAMpD,CAAA;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAG3E;AAED,wBAAgB,YAAY,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAG3D;AAED,wBAAgB,cAAc,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAGlD;AAED,wBAAgB,cAAc,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAGlD;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,aAAa,GAAG,MAAM,CAqB1D;AAED,wBAAgB,qBAAqB,CACnC,MAAM,EAAE,aAAa,CAAC,QAAQ,CAAC,EAC/B,QAAQ,EAAE,mBAAmB,GAC5B,MAAM,CAWR;AAED,wBAAgB,0BAA0B,CACxC,WAAW,EAAE,aAAa,CAAC,aAAa,CAAC,EACzC,QAAQ,EAAE,mBAAmB,GAC5B,MAAM,CAmBR;AAED,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,aAAa,CAAC,QAAQ,CAAC,EAC/B,QAAQ,EAAE,mBAAmB,GAC5B,MAAM,CAaR;AAED,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,aAAa,EAAE,QAAQ,EAAE,mBAAmB,GAAG,MAAM,CAK9F;AASD,MAAM,WAAW,6BAA6B;IAC5C,IAAI,EAAE;QACJ,OAAO,EAAE;YACP,OAAO,EAAE;gBACP,EAAE,EAAE,MAAM,CAAA;gBACV,IAAI,EAAE,MAAM,CAAA;gBACZ,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBAC3B,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;gBACrB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBAC9B,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBAC7B,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBAC7B,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBACxB,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;aACxB,CAAA;YACD,OAAO,EAAE,KAAK,CAAC;gBAAE,EAAE,EAAE,MAAM,CAAC;gBAAC,IAAI,EAAE,MAAM,CAAC;gBAAC,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;aAAE,CAAC,CAAA;YACzE,IAAI,EAAE,KAAK,CAAC;gBACV,UAAU,EAAE,MAAM,CAAA;gBAClB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBACrB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBACxB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;aAC/B,CAAC,CAAA;YACF,KAAK,EAAE,KAAK,CAAC;gBAAE,GAAG,EAAE,MAAM,CAAC;gBAAC,IAAI,EAAE,MAAM,CAAC;gBAAC,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;aAAE,CAAC,CAAA;YACpE,QAAQ,EAAE,KAAK,CAAC;gBAAE,IAAI,EAAE,MAAM,CAAC;gBAAC,IAAI,EAAE,MAAM,CAAA;aAAE,CAAC,CAAA;YAC/C,UAAU,CAAC,EAAE,KAAK,CAAC;gBACjB,EAAE,EAAE,MAAM,CAAA;gBACV,SAAS,EAAE,MAAM,CAAA;gBACjB,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBACvB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBACtB,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBACxB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBACzB,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBAClC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;gBACxB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;aACrB,CAAC,CAAA;SACH,CAAA;QACD,aAAa,EAAE,MAAM,CAAA;QACrB,UAAU,EAAE,OAAO,GAAG,gBAAgB,GAAG,gBAAgB,GAAG,KAAK,CAAA;QACjE,MAAM,EAAE,eAAe,GAAG,eAAe,GAAG,aAAa,GAAG,OAAO,CAAA;QACnE,YAAY,EAAE,OAAO,CAAA;QACrB,WAAW,EAAE,OAAO,CAAA;QACpB,kBAAkB,EAAE,OAAO,CAAA;KAC5B,CAAA;CACF"}

package/dist/components/product-detail/product-detail-shared.js

@@ -0,0 +1,157 @@
+import { queryOptions } from "@tanstack/react-query";
+export function getProductDaysQueryOptions(api, id) {
+    return queryOptions({
+        queryKey: ["product-days", id],
+        queryFn: () => api.get(`/v1/products/${id}/days`),
+    });
+}
+export function getProductSlotsQueryOptions(api, id) {
+    return queryOptions({
+        queryKey: ["product-slots", id],
+        queryFn: () => api.get(`/v1/availability/slots?productId=${id}&limit=25`),
+    });
+}
+export function getProductRulesQueryOptions(api, id) {
+    return queryOptions({
+        queryKey: ["product-rules", id],
+        queryFn: () => api.get(`/v1/availability/rules?productId=${id}&limit=50`),
+    });
+}
+export function getProductDayServicesQueryOptions(api, productId, dayId) {
+    return queryOptions({
+        queryKey: ["product-day-services", productId, dayId],
+        queryFn: () => api.get(`/v1/products/${productId}/days/${dayId}/services`),
+    });
+}
+export function getChannelsQueryOptions(api) {
+    return queryOptions({
+        queryKey: ["channels"],
+        queryFn: () => api.get("/v1/distribution/channels?limit=25"),
+    });
+}
+export function getProductChannelMappingsQueryOptions(api, id) {
+    return queryOptions({
+        queryKey: ["product-channel-mappings", id],
+        queryFn: () => api.get(`/v1/distribution/product-mappings?productId=${id}&limit=25`),
+    });
+}
+export function getProductMediaQueryOptions(api, id) {
+    return queryOptions({
+        queryKey: ["product-media", id],
+        queryFn: () => api.get(`/v1/products/${id}/media?limit=50`),
+    });
+}
+export function getProductDayMediaQueryOptions(api, productId, dayId) {
+    return queryOptions({
+        queryKey: ["day-media", productId, dayId],
+        queryFn: () => api.get(`/v1/products/${productId}/days/${dayId}/media?limit=50`),
+    });
+}
+export const statusVariant = {
+    draft: "outline",
+    active: "default",
+    archived: "secondary",
+};
+export const slotStatusVariant = {
+    open: "default",
+    closed: "secondary",
+    sold_out: "outline",
+    cancelled: "destructive",
+};
+export function formatAmount(cents, currency) {
+    if (cents == null)
+        return "-";
+    return `${(cents / 100).toFixed(2)} ${currency}`;
+}
+export function formatMargin(percent) {
+    if (percent == null)
+        return "-";
+    return `${percent.toFixed(0)}%`;
+}
+export function formatSlotTime(iso) {
+    const date = new Date(iso);
+    return `${String(date.getUTCHours()).padStart(2, "0")}:${String(date.getUTCMinutes()).padStart(2, "0")}`;
+}
+export function formatSlotDate(iso) {
+    const date = new Date(iso);
+    return `${date.getUTCFullYear()}-${String(date.getUTCMonth() + 1).padStart(2, "0")}-${String(date.getUTCDate()).padStart(2, "0")}`;
+}
+export function formatDuration(slot) {
+    if (slot.nights != null || slot.days != null) {
+        const parts = [];
+        if (slot.days != null)
+            parts.push(`${slot.days} day${slot.days === 1 ? "" : "s"}`);
+        if (slot.nights != null)
+            parts.push(`${slot.nights} night${slot.nights === 1 ? "" : "s"}`);
+        return parts.join(" / ");
+    }
+    if (!slot.endsAt)
+        return "-";
+    const startMs = new Date(slot.startsAt).getTime();
+    const endMs = new Date(slot.endsAt).getTime();
+    const diffMs = endMs - startMs;
+    if (diffMs <= 0)
+        return "-";
+    const hours = diffMs / 3_600_000;
+    if (hours < 24)
+        return `${hours.toFixed(hours % 1 === 0 ? 0 : 1)}h`;
+    const startDate = formatSlotDate(slot.startsAt);
+    const endDate = formatSlotDate(slot.endsAt);
+    const nights = Math.round((new Date(`${endDate}T00:00:00Z`).getTime() - new Date(`${startDate}T00:00:00Z`).getTime()) /
+        86_400_000);
+    return `${nights} night${nights === 1 ? "" : "s"}`;
+}
+export function getProductStatusLabel(status, messages) {
+    switch (status) {
+        case "draft":
+            return messages.products.core.statusDraft;
+        case "active":
+            return messages.products.core.statusActive;
+        case "archived":
+            return messages.products.core.statusArchived;
+        default:
+            return status;
+    }
+}
+export function getProductBookingModeLabel(bookingMode, messages) {
+    switch (bookingMode) {
+        case "date":
+            return messages.products.core.bookingModeDate;
+        case "date_time":
+            return messages.products.core.bookingModeDateTime;
+        case "open":
+            return messages.products.core.bookingModeOpen;
+        case "stay":
+            return messages.products.core.bookingModeStay;
+        case "transfer":
+            return messages.products.core.bookingModeTransfer;
+        case "itinerary":
+            return messages.products.core.bookingModeItinerary;
+        case "other":
+            return messages.products.core.bookingModeOther;
+        default:
+            return bookingMode;
+    }
+}
+export function getDepartureStatusLabel(status, messages) {
+    switch (status) {
+        case "open":
+            return messages.products.core.departureStatusOpen;
+        case "closed":
+            return messages.products.core.departureStatusClosed;
+        case "sold_out":
+            return messages.products.core.departureStatusSoldOut;
+        case "cancelled":
+            return messages.products.core.departureStatusCancelled;
+        default:
+            return status;
+    }
+}
+export function formatCapacityLabel(slot, messages) {
+    if (slot.unlimited)
+        return messages.products.core.unlimitedCapacity;
+    if (slot.initialPax == null)
+        return messages.products.core.noValue;
+    const remaining = slot.remainingPax ?? slot.initialPax;
+    return `${remaining} / ${slot.initialPax}`;
+}

package/dist/components/product-detail/product-detail-skeleton.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Layout-matched placeholder for ProductDetailPage. Mirrors the real shell:
+ *   - Header: title + status + action buttons
+ *   - 2-column body (1fr + 320px)
+ *     - Left stack: Details, Departures, Schedules, Itinerary (3 days), Options
+ *     - Right stack: Channels, Organize, Media (3x3 grid)
+ */
+export declare function ProductDetailSkeleton(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-detail-skeleton.d.ts.map

package/dist/components/product-detail/product-detail-skeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-detail-skeleton.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/product-detail-skeleton.tsx"],"names":[],"mappings":"AAGA;;;;;;GAMG;AACH,wBAAgB,qBAAqB,4CAwBpC"}