@voyant-travel/inventory-react 0.1.0

package/dist/components/product-tag-list.js

@@ -0,0 +1,44 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from "@voyant-travel/ui/components/button";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, } from "@voyant-travel/ui/components/dropdown-menu";
+import { Input } from "@voyant-travel/ui/components/input";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "@voyant-travel/ui/components/table";
+import { Loader2, MoreHorizontal, Pencil, Plus, Search, Trash2 } from "lucide-react";
+import * as React from "react";
+import { useProductsUiMessagesOrDefault } from "../i18n/provider.js";
+import { useProductTagMutation, useProductTags } from "../index.js";
+import { ProductTagDialog } from "./product-tag-dialog.js";
+export function ProductTagList({ pageSize = 200 } = {}) {
+    const [search, setSearch] = React.useState("");
+    const [offset, setOffset] = React.useState(0);
+    const [dialogOpen, setDialogOpen] = React.useState(false);
+    const [editing, setEditing] = React.useState(undefined);
+    const { data, isPending, isError } = useProductTags({
+        search: search || undefined,
+        limit: pageSize,
+        offset,
+    });
+    const { remove } = useProductTagMutation();
+    const messages = useProductsUiMessagesOrDefault();
+    const tags = data?.data ?? [];
+    const total = data?.total ?? 0;
+    const page = Math.floor(offset / pageSize) + 1;
+    const pageCount = Math.max(1, Math.ceil(total / pageSize));
+    return (_jsxs("div", { "data-slot": "product-tag-list", className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [_jsxs("div", { className: "relative w-full max-w-sm", children: [_jsx(Search, { className: "absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { placeholder: messages.productTagList.searchPlaceholder, value: search, onChange: (event) => {
+                                    setSearch(event.target.value);
+                                    setOffset(0);
+                                }, className: "pl-9" })] }), _jsxs(Button, { onClick: () => {
+                            setEditing(undefined);
+                            setDialogOpen(true);
+                        }, children: [_jsx(Plus, { className: "mr-2 size-4", "aria-hidden": "true" }), messages.productTagList.addTag] })] }), _jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: messages.productTagList.columns.name }), _jsx(TableHead, { className: "w-[80px] text-right", children: messages.productTagList.columns.actions })] }) }), _jsx(TableBody, { children: isPending ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 2, className: "h-24 text-center", children: _jsx(Loader2, { className: "mx-auto size-4 animate-spin text-muted-foreground" }) }) })) : isError ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 2, className: "h-24 text-center text-sm text-destructive", children: messages.productTagList.loadingError }) })) : tags.length === 0 ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 2, className: "h-24 text-center text-sm text-muted-foreground", children: messages.productTagList.empty }) })) : (tags.map((tag) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-medium", children: tag.name }), _jsx(TableCell, { className: "text-right", children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { className: "inline-flex size-8 items-center justify-center rounded-md text-muted-foreground outline-hidden hover:bg-accent hover:text-accent-foreground", children: _jsx(MoreHorizontal, { className: "size-4" }) }), _jsxs(DropdownMenuContent, { align: "end", children: [_jsxs(DropdownMenuItem, { onClick: () => {
+                                                                setEditing(tag);
+                                                                setDialogOpen(true);
+                                                            }, children: [_jsx(Pencil, { className: "size-4" }), messages.productTagList.edit] }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { variant: "destructive", onClick: () => {
+                                                                if (confirm(messages.productTagList.deleteConfirm)) {
+                                                                    remove.mutate(tag.id);
+                                                                }
+                                                            }, children: [_jsx(Trash2, { className: "size-4" }), messages.productTagList.delete] })] })] }) })] }, tag.id)))) })] }) }), _jsxs("div", { className: "flex items-center justify-between text-sm text-muted-foreground", children: [_jsx("span", { children: messages.productTagList.showingSummary
+                            .replace("{count}", String(tags.length))
+                            .replace("{total}", String(total)) }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", size: "sm", disabled: offset === 0, onClick: () => setOffset((prev) => Math.max(0, prev - pageSize)), children: messages.common.previous }), _jsxs("span", { children: [messages.common.page, " ", page, " / ", pageCount] }), _jsx(Button, { variant: "outline", size: "sm", disabled: offset + pageSize >= total, onClick: () => setOffset((prev) => prev + pageSize), children: messages.common.next })] })] }), _jsx(ProductTagDialog, { open: dialogOpen, onOpenChange: setDialogOpen, tag: editing })] }));
+}

package/dist/components/product-tags-page.d.ts

@@ -0,0 +1,7 @@
+import { type ProductTagListProps } from "./product-tag-list.js";
+export interface ProductTagsPageProps {
+    pageSize?: ProductTagListProps["pageSize"];
+    className?: string;
+}
+export declare function ProductTagsPage({ pageSize, className }?: ProductTagsPageProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-tags-page.d.ts.map

package/dist/components/product-tags-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-tags-page.d.ts","sourceRoot":"","sources":["../../src/components/product-tags-page.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAkB,KAAK,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAEhF,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAA;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAE,oBAAyB,2CAajF"}

package/dist/components/product-tags-page.js

@@ -0,0 +1,9 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "@voyant-travel/ui/lib/utils";
+import { useProductsUiMessagesOrDefault } from "../i18n/index.js";
+import { ProductTagList } from "./product-tag-list.js";
+export function ProductTagsPage({ pageSize, className } = {}) {
+    const messages = useProductsUiMessagesOrDefault().productTagsPage;
+    return (_jsxs("div", { "data-slot": "product-tags-page", className: cn("flex flex-col gap-6 p-6", className), children: [_jsxs("div", { children: [_jsx("h2", { className: "text-lg font-semibold tracking-tight", children: messages.title }), _jsx("p", { className: "text-sm text-muted-foreground", children: messages.description })] }), _jsx(ProductTagList, { pageSize: pageSize })] }));
+}

package/dist/components/product-tax-class-combobox.d.ts

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

package/dist/components/product-tax-class-combobox.d.ts.map

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

package/dist/components/product-tax-class-combobox.js

@@ -0,0 +1,100 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useQuery } from "@tanstack/react-query";
+import { Combobox, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxList, } from "@voyant-travel/ui/components/combobox";
+import * as React from "react";
+import { z } from "zod";
+import { useProductsUiMessagesOrDefault } from "../i18n/provider.js";
+import { fetchWithValidation, useVoyantProductsContext } from "../index.js";
+const PAGE_SIZE = 100;
+const taxClassRecordSchema = z
+    .object({
+    id: z.string(),
+    code: z.string(),
+    label: z.string(),
+    description: z.string().nullable().optional(),
+    active: z.boolean(),
+})
+    .passthrough();
+const taxClassListResponse = z.object({
+    data: z.array(taxClassRecordSchema),
+    total: z.number().int(),
+    limit: z.number().int(),
+    offset: z.number().int(),
+});
+const taxClassSingleResponse = z.object({ data: taxClassRecordSchema });
+function useTaxClassOptions() {
+    const { baseUrl, fetcher } = useVoyantProductsContext();
+    return useQuery({
+        queryKey: ["voyant", "products-ui", "tax-class-combobox", "list"],
+        queryFn: () => {
+            const params = new URLSearchParams();
+            params.set("limit", String(PAGE_SIZE));
+            params.set("active", "true");
+            return fetchWithValidation(`/v1/finance/tax-classes?${params}`, taxClassListResponse, {
+                baseUrl,
+                fetcher,
+            });
+        },
+    });
+}
+function useSelectedTaxClass(id) {
+    const { baseUrl, fetcher } = useVoyantProductsContext();
+    return useQuery({
+        queryKey: ["voyant", "products-ui", "tax-class-combobox", "detail", id],
+        queryFn: async () => {
+            if (!id)
+                throw new Error("useSelectedTaxClass requires an id");
+            const { data } = await fetchWithValidation(`/v1/finance/tax-classes/${id}`, taxClassSingleResponse, { baseUrl, fetcher });
+            return data;
+        },
+        enabled: Boolean(id),
+    });
+}
+export function ProductTaxClassCombobox({ value, onChange, placeholder, disabled }) {
+    const messages = useProductsUiMessagesOrDefault();
+    const [search, setSearch] = React.useState("");
+    const listQuery = useTaxClassOptions();
+    const selectedQuery = useSelectedTaxClass(value);
+    const items = React.useMemo(() => {
+        const map = new Map();
+        for (const item of listQuery.data?.data ?? [])
+            map.set(item.id, item);
+        if (selectedQuery.data)
+            map.set(selectedQuery.data.id, selectedQuery.data);
+        const normalizedSearch = search.trim().toLowerCase();
+        const values = Array.from(map.values());
+        if (!normalizedSearch)
+            return values;
+        return values.filter((item) => item.label.toLowerCase().includes(normalizedSearch) ||
+            item.code.toLowerCase().includes(normalizedSearch));
+    }, [listQuery.data?.data, search, selectedQuery.data]);
+    const itemMap = React.useMemo(() => new Map(items.map((item) => [item.id, item])), [items]);
+    const selected = value ? itemMap.get(value) : selectedQuery.data;
+    const selectedLabel = selected ? `${selected.label} · ${selected.code}` : "";
+    const [inputValue, setInputValue] = React.useState(selectedLabel);
+    React.useEffect(() => {
+        setInputValue(selectedLabel);
+    }, [selectedLabel]);
+    return (_jsxs(Combobox, { items: items.map((item) => item.id), value: value ?? null, inputValue: inputValue, autoHighlight: true, disabled: disabled, itemToStringValue: (id) => {
+            const item = itemMap.get(id);
+            return item ? `${item.label} · ${item.code}` : "";
+        }, onInputValueChange: (next) => {
+            setInputValue(next);
+            setSearch(next);
+            if (!next)
+                onChange(null);
+        }, onValueChange: (next) => {
+            const id = next ?? null;
+            onChange(id);
+            const item = id ? itemMap.get(id) : null;
+            setInputValue(item ? `${item.label} · ${item.code}` : "");
+        }, children: [_jsx(ComboboxInput, { placeholder: placeholder ?? messages.comboboxes.taxClass.placeholder, showClear: !!value }), _jsxs(ComboboxContent, { children: [_jsx(ComboboxEmpty, { children: listQuery.isPending || selectedQuery.isPending
+                            ? messages.common.loading
+                            : messages.comboboxes.taxClass.empty }), _jsx(ComboboxList, { children: _jsx(ComboboxCollection, { children: (id) => {
+                                const item = itemMap.get(id);
+                                if (!item)
+                                    return null;
+                                return (_jsx(ComboboxItem, { value: item.id, children: _jsxs("div", { className: "flex min-w-0 flex-col", children: [_jsx("span", { className: "truncate font-medium", children: item.label }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: item.code })] }) }, item.id));
+                            } }) })] })] }));
+}

package/dist/components/product-translations-card.d.ts

@@ -0,0 +1,7 @@
+import { type ProductRecord } from "../index.js";
+export interface ProductTranslationsCardProps {
+    product: ProductRecord;
+    className?: string;
+}
+export declare function ProductTranslationsCard({ product, className }: ProductTranslationsCardProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-translations-card.d.ts.map

package/dist/components/product-translations-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-translations-card.d.ts","sourceRoot":"","sources":["../../src/components/product-translations-card.tsx"],"names":[],"mappings":"AAyBA,OAAO,EAEL,KAAK,aAAa,EAKnB,MAAM,aAAa,CAAA;AAEpB,MAAM,WAAW,4BAA4B;IAC3C,OAAO,EAAE,aAAa,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AA8ED,wBAAgB,uBAAuB,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,4BAA4B,2CA4W3F"}

package/dist/components/product-translations-card.js

@@ -0,0 +1,188 @@
+"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 { Card, CardContent, CardDescription, CardHeader, CardTitle, } from "@voyant-travel/ui/components/card";
+import { Input } from "@voyant-travel/ui/components/input";
+import { Label } from "@voyant-travel/ui/components/label";
+import { RichTextEditor } from "@voyant-travel/ui/components/rich-text-editor";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from "@voyant-travel/ui/components/select";
+import { Textarea } from "@voyant-travel/ui/components/textarea";
+import { Copy, Languages, Loader2, Plus, Save, Trash2 } from "lucide-react";
+import * as React from "react";
+import { useProductsUiMessagesOrDefault } from "../i18n/provider.js";
+import { useProductTranslationMutation, useProductTranslations, } from "../index.js";
+function emptyTranslationState(languageTag = "") {
+    return {
+        languageTag,
+        slug: "",
+        name: "",
+        shortDescription: "",
+        description: "",
+        inclusionsHtml: "",
+        exclusionsHtml: "",
+        termsHtml: "",
+        seoTitle: "",
+        seoDescription: "",
+    };
+}
+function translationToState(translation) {
+    return {
+        languageTag: translation.languageTag,
+        slug: translation.slug ?? "",
+        name: translation.name,
+        shortDescription: translation.shortDescription ?? "",
+        description: translation.description ?? "",
+        inclusionsHtml: translation.inclusionsHtml ?? "",
+        exclusionsHtml: translation.exclusionsHtml ?? "",
+        termsHtml: translation.termsHtml ?? "",
+        seoTitle: translation.seoTitle ?? "",
+        seoDescription: translation.seoDescription ?? "",
+    };
+}
+function normalizeOptional(value) {
+    const trimmed = value.trim();
+    return trimmed.length > 0 ? trimmed : null;
+}
+function normalizeLanguageTag(value) {
+    const trimmed = value.trim();
+    if (!trimmed)
+        return "";
+    try {
+        return Intl.getCanonicalLocales(trimmed)[0] ?? trimmed;
+    }
+    catch {
+        return trimmed;
+    }
+}
+function toPayload(state) {
+    return {
+        languageTag: normalizeLanguageTag(state.languageTag),
+        slug: normalizeOptional(state.slug),
+        name: state.name.trim(),
+        shortDescription: normalizeOptional(state.shortDescription),
+        description: normalizeOptional(state.description),
+        inclusionsHtml: normalizeOptional(state.inclusionsHtml),
+        exclusionsHtml: normalizeOptional(state.exclusionsHtml),
+        termsHtml: normalizeOptional(state.termsHtml),
+        seoTitle: normalizeOptional(state.seoTitle),
+        seoDescription: normalizeOptional(state.seoDescription),
+    };
+}
+export function ProductTranslationsCard({ product, className }) {
+    const messages = useProductsUiMessagesOrDefault();
+    const cardMessages = messages.productTranslationsCard;
+    const translationsQuery = useProductTranslations(product.id, { limit: 100 });
+    const mutations = useProductTranslationMutation();
+    const translations = translationsQuery.data?.data ?? [];
+    const [selectedLanguageTag, setSelectedLanguageTag] = React.useState("");
+    const [newLanguageTag, setNewLanguageTag] = React.useState("");
+    const [state, setState] = React.useState(() => emptyTranslationState());
+    const [error, setError] = React.useState(null);
+    const baseId = React.useId();
+    const selectedTranslation = translations.find((translation) => translation.languageTag === selectedLanguageTag) ?? null;
+    const isSaving = mutations.create.isPending || mutations.update.isPending;
+    const isDeleting = mutations.remove.isPending;
+    React.useEffect(() => {
+        if (!selectedLanguageTag && translations.length > 0) {
+            setSelectedLanguageTag(translations[0]?.languageTag ?? "");
+        }
+    }, [selectedLanguageTag, translations]);
+    React.useEffect(() => {
+        if (selectedTranslation) {
+            setState(translationToState(selectedTranslation));
+            return;
+        }
+        if (selectedLanguageTag) {
+            setState(emptyTranslationState(selectedLanguageTag));
+        }
+    }, [selectedLanguageTag, selectedTranslation]);
+    const field = (key) => (value) => {
+        setState((prev) => ({ ...prev, [key]: value }));
+    };
+    const handleAddLanguage = () => {
+        setError(null);
+        const normalized = normalizeLanguageTag(newLanguageTag);
+        if (!normalized) {
+            setError(cardMessages.states.languageRequired);
+            return;
+        }
+        setSelectedLanguageTag(normalized);
+        setState(emptyTranslationState(normalized));
+        setNewLanguageTag("");
+    };
+    const handleCopyBase = () => {
+        setState((prev) => ({
+            ...prev,
+            name: product.name,
+            shortDescription: "",
+            description: product.description ?? "",
+            inclusionsHtml: product.inclusionsHtml ?? "",
+            exclusionsHtml: product.exclusionsHtml ?? "",
+            termsHtml: product.termsHtml ?? "",
+            seoTitle: product.name,
+            seoDescription: product.description ?? "",
+        }));
+    };
+    const handleSubmit = async (event) => {
+        event.preventDefault();
+        setError(null);
+        const languageTag = normalizeLanguageTag(state.languageTag);
+        if (!languageTag) {
+            setError(cardMessages.states.languageRequired);
+            return;
+        }
+        if (!state.name.trim()) {
+            setError(cardMessages.states.nameRequired);
+            return;
+        }
+        try {
+            const payload = toPayload({ ...state, languageTag });
+            if (selectedTranslation) {
+                const { translation } = await mutations.update.mutateAsync({
+                    productId: product.id,
+                    translationId: selectedTranslation.id,
+                    input: payload,
+                });
+                setSelectedLanguageTag(translation.languageTag);
+            }
+            else {
+                const translation = await mutations.create.mutateAsync({
+                    productId: product.id,
+                    input: payload,
+                });
+                setSelectedLanguageTag(translation.languageTag);
+            }
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : cardMessages.states.saveFailed);
+        }
+    };
+    const handleDelete = async () => {
+        if (!selectedTranslation)
+            return;
+        setError(null);
+        if (!confirm(cardMessages.states.deleteConfirm.replace("{languageTag}", selectedTranslation.languageTag))) {
+            return;
+        }
+        try {
+            await mutations.remove.mutateAsync({
+                productId: product.id,
+                translationId: selectedTranslation.id,
+            });
+            const next = translations.find((translation) => translation.id !== selectedTranslation.id);
+            setSelectedLanguageTag(next?.languageTag ?? "");
+            setState(emptyTranslationState(next?.languageTag ?? ""));
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : cardMessages.states.deleteFailed);
+        }
+    };
+    return (_jsxs(Card, { "data-slot": "product-translations-card", className: className, children: [_jsx(CardHeader, { children: _jsxs("div", { className: "flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between", children: [_jsxs("div", { className: "space-y-1.5", children: [_jsx(CardTitle, { children: cardMessages.title }), _jsx(CardDescription, { children: cardMessages.description })] }), _jsxs("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-end", children: [_jsxs("div", { className: "flex min-w-40 flex-col gap-1.5", children: [_jsx(Label, { htmlFor: `${baseId}-language-select`, children: cardMessages.languageSelectLabel }), _jsxs(Select, { value: selectedLanguageTag, onValueChange: (value) => {
+                                                setError(null);
+                                                setSelectedLanguageTag(value ?? "");
+                                            }, disabled: translations.length === 0 && !selectedLanguageTag, children: [_jsx(SelectTrigger, { id: `${baseId}-language-select`, className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [translations.map((translation) => (_jsx(SelectItem, { value: translation.languageTag, children: translation.languageTag }, translation.id))), selectedLanguageTag &&
+                                                            !translations.some((translation) => translation.languageTag === selectedLanguageTag) ? (_jsx(SelectItem, { value: selectedLanguageTag, children: selectedLanguageTag })) : null] })] })] }), _jsxs("div", { className: "flex flex-1 flex-col gap-1.5 sm:min-w-40", children: [_jsx(Label, { htmlFor: `${baseId}-new-language`, children: cardMessages.newLanguageLabel }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Input, { id: `${baseId}-new-language`, value: newLanguageTag, onChange: (event) => setNewLanguageTag(event.target.value), placeholder: cardMessages.placeholders.newLanguage }), _jsxs(Button, { type: "button", variant: "outline", onClick: handleAddLanguage, children: [_jsx(Plus, { className: "size-4", "aria-hidden": "true" }), cardMessages.actions.addLanguage] })] })] })] })] }) }), _jsxs(CardContent, { className: "space-y-4", children: [translationsQuery.isPending ? (_jsxs("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [_jsx(Loader2, { className: "size-4 animate-spin", "aria-hidden": "true" }), cardMessages.states.loading] })) : null, translationsQuery.isError ? (_jsx("p", { className: "text-sm text-destructive", children: translationsQuery.error instanceof Error
+                            ? translationsQuery.error.message
+                            : cardMessages.states.loadFailed })) : null, !translationsQuery.isPending && translations.length === 0 && !selectedLanguageTag ? (_jsxs("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [_jsx(Languages, { className: "size-4", "aria-hidden": "true" }), cardMessages.states.noTranslations] })) : null, translations.length > 0 ? (_jsx("div", { className: "flex flex-wrap gap-2", children: translations.map((translation) => (_jsx(Badge, { variant: translation.languageTag === selectedLanguageTag ? "default" : "outline", children: translation.languageTag }, translation.id))) })) : null, _jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [_jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: `${baseId}-language-tag`, children: cardMessages.fields.languageTag }), _jsx(Input, { id: `${baseId}-language-tag`, required: true, value: state.languageTag, onChange: (event) => field("languageTag")(event.target.value), placeholder: cardMessages.placeholders.languageTag })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: `${baseId}-slug`, children: cardMessages.fields.slug }), _jsx(Input, { id: `${baseId}-slug`, value: state.slug, onChange: (event) => field("slug")(event.target.value), placeholder: cardMessages.placeholders.slug })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: `${baseId}-name`, children: cardMessages.fields.name }), _jsx(Input, { id: `${baseId}-name`, required: true, value: state.name, onChange: (event) => field("name")(event.target.value), placeholder: cardMessages.placeholders.name })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: `${baseId}-short-description`, children: cardMessages.fields.shortDescription }), _jsx(Input, { id: `${baseId}-short-description`, value: state.shortDescription, onChange: (event) => field("shortDescription")(event.target.value), placeholder: cardMessages.placeholders.shortDescription })] })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: `${baseId}-description`, children: cardMessages.fields.description }), _jsx(Textarea, { id: `${baseId}-description`, value: state.description, onChange: (event) => field("description")(event.target.value), placeholder: cardMessages.placeholders.description })] }), _jsxs("div", { className: "grid gap-4", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { children: cardMessages.fields.inclusions }), _jsx(RichTextEditor, { value: state.inclusionsHtml, onChange: field("inclusionsHtml"), placeholder: cardMessages.placeholders.inclusions, editorClassName: "max-h-[320px] overflow-y-auto" })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { children: cardMessages.fields.exclusions }), _jsx(RichTextEditor, { value: state.exclusionsHtml, onChange: field("exclusionsHtml"), placeholder: cardMessages.placeholders.exclusions, editorClassName: "max-h-[320px] overflow-y-auto" })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { children: cardMessages.fields.terms }), _jsx(RichTextEditor, { value: state.termsHtml, onChange: field("termsHtml"), placeholder: cardMessages.placeholders.terms, editorClassName: "max-h-[320px] overflow-y-auto" })] })] }), _jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: `${baseId}-seo-title`, children: cardMessages.fields.seoTitle }), _jsx(Input, { id: `${baseId}-seo-title`, value: state.seoTitle, onChange: (event) => field("seoTitle")(event.target.value), placeholder: cardMessages.placeholders.seoTitle })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: `${baseId}-seo-description`, children: cardMessages.fields.seoDescription }), _jsx(Textarea, { id: `${baseId}-seo-description`, value: state.seoDescription, onChange: (event) => field("seoDescription")(event.target.value), placeholder: cardMessages.placeholders.seoDescription })] })] }), error ? _jsx("p", { className: "text-sm text-destructive", children: error }) : null, _jsxs("div", { className: "flex flex-wrap justify-end gap-2", children: [_jsxs(Button, { type: "button", variant: "outline", onClick: handleCopyBase, children: [_jsx(Copy, { className: "size-4", "aria-hidden": "true" }), cardMessages.actions.copyBase] }), selectedTranslation ? (_jsxs(Button, { type: "button", variant: "destructive", disabled: isDeleting, onClick: () => void handleDelete(), children: [isDeleting ? (_jsx(Loader2, { className: "size-4 animate-spin", "aria-hidden": "true" })) : (_jsx(Trash2, { className: "size-4", "aria-hidden": "true" })), isDeleting ? cardMessages.actions.deleting : cardMessages.actions.delete] })) : null, _jsxs(Button, { type: "submit", disabled: isSaving, children: [isSaving ? (_jsx(Loader2, { className: "size-4 animate-spin", "aria-hidden": "true" })) : (_jsx(Save, { className: "size-4", "aria-hidden": "true" })), isSaving ? cardMessages.actions.saving : cardMessages.actions.save] })] })] })] })] }));
+}

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

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

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

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

package/dist/components/product-type-combobox.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Combobox, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxList, } from "@voyant-travel/ui/components/combobox";
+import * as React from "react";
+import { useProductsUiMessagesOrDefault } from "../i18n/provider.js";
+import { useProductType, useProductTypes } from "../index.js";
+const PAGE_SIZE = 25;
+export function ProductTypeCombobox({ value, onChange, placeholder, disabled }) {
+    const messages = useProductsUiMessagesOrDefault();
+    const [search, setSearch] = React.useState("");
+    const listQuery = useProductTypes({ active: true, search: search || undefined, limit: PAGE_SIZE });
+    const selectedQuery = useProductType(value, { enabled: !!value });
+    const items = React.useMemo(() => {
+        const map = new Map();
+        for (const item of listQuery.data?.data ?? [])
+            map.set(item.id, item);
+        if (selectedQuery.data)
+            map.set(selectedQuery.data.id, selectedQuery.data);
+        return Array.from(map.values());
+    }, [listQuery.data?.data, selectedQuery.data]);
+    const itemMap = React.useMemo(() => new Map(items.map((item) => [item.id, item])), [items]);
+    const selected = value ? itemMap.get(value) : undefined;
+    const selectedLabel = selected ? `${selected.name} · ${selected.code}` : "";
+    const [inputValue, setInputValue] = React.useState(selectedLabel);
+    React.useEffect(() => {
+        setInputValue(selectedLabel);
+    }, [selectedLabel]);
+    return (_jsxs(Combobox, { items: items.map((item) => item.id), value: value ?? null, inputValue: inputValue, autoHighlight: true, disabled: disabled, itemToStringValue: (id) => {
+            const item = itemMap.get(id);
+            return item ? `${item.name} · ${item.code}` : "";
+        }, onInputValueChange: (next) => {
+            setInputValue(next);
+            setSearch(next);
+            if (!next)
+                onChange(null);
+        }, onValueChange: (next) => {
+            const id = next ?? null;
+            onChange(id);
+            const item = id ? itemMap.get(id) : null;
+            setInputValue(item ? `${item.name} · ${item.code}` : "");
+        }, children: [_jsx(ComboboxInput, { placeholder: placeholder ?? messages.comboboxes.productType.placeholder, showClear: !!value }), _jsxs(ComboboxContent, { children: [_jsx(ComboboxEmpty, { children: listQuery.isPending || selectedQuery.isPending
+                            ? messages.common.loading
+                            : messages.comboboxes.productType.empty }), _jsx(ComboboxList, { children: _jsx(ComboboxCollection, { children: (id) => {
+                                const item = itemMap.get(id);
+                                if (!item)
+                                    return null;
+                                return (_jsx(ComboboxItem, { value: item.id, children: _jsxs("div", { className: "flex min-w-0 flex-col", children: [_jsx("span", { className: "truncate font-medium", children: item.name }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: item.code })] }) }, item.id));
+                            } }) })] })] }));
+}

package/dist/components/product-types-page.d.ts

@@ -0,0 +1,6 @@
+export interface ProductTypesPageProps {
+    pageSize?: number;
+    className?: string;
+}
+export declare function ProductTypesPage({ pageSize, className, }?: ProductTypesPageProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-types-page.d.ts.map

package/dist/components/product-types-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-types-page.d.ts","sourceRoot":"","sources":["../../src/components/product-types-page.tsx"],"names":[],"mappings":"AAmCA,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAgBD,wBAAgB,gBAAgB,CAAC,EAC/B,QAA4B,EAC5B,SAAS,GACV,GAAE,qBAA0B,2CAyI5B"}

package/dist/components/product-types-page.js

@@ -0,0 +1,103 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge, Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, Input, Label, Sheet, SheetBody, SheetContent, SheetFooter, SheetHeader, SheetTitle, Switch, Textarea, } from "@voyant-travel/ui/components";
+import { cn } from "@voyant-travel/ui/lib/utils";
+import { zodResolver } from "@voyant-travel/ui/lib/zod-resolver";
+import { Loader2, MoreHorizontal, Pencil, Plus, Trash2 } from "lucide-react";
+import { useEffect, useMemo, useState } from "react";
+import { useForm } from "react-hook-form";
+import { z } from "zod/v4";
+import { useProductsUiMessagesOrDefault } from "../i18n/index.js";
+import { useProductTypeMutation, useProductTypes } from "../index.js";
+const DEFAULT_PAGE_SIZE = 25;
+function getFormSchema(messages) {
+    return z.object({
+        name: z.string().min(1, messages.validation.nameRequired).max(255),
+        code: z.string().min(1, messages.validation.codeRequired).max(100),
+        description: z.string().optional().nullable(),
+        sortOrder: z.coerce.number().int().default(0),
+        active: z.boolean().default(true),
+    });
+}
+export function ProductTypesPage({ pageSize = DEFAULT_PAGE_SIZE, className, } = {}) {
+    const messages = useProductsUiMessagesOrDefault();
+    const pageMessages = messages.productTypesPage;
+    const [sheetOpen, setSheetOpen] = useState(false);
+    const [editing, setEditing] = useState();
+    const [pageIndex, setPageIndex] = useState(0);
+    const { data, isPending, refetch } = useProductTypes({
+        limit: pageSize,
+        offset: pageIndex * pageSize,
+    });
+    const { remove } = useProductTypeMutation();
+    const items = data?.data ?? [];
+    const total = data?.total ?? 0;
+    const pageCount = Math.max(1, Math.ceil(total / pageSize));
+    return (_jsxs("div", { "data-slot": "product-types-page", className: cn("flex flex-col gap-6 p-6", className), children: [_jsxs("div", { className: "flex items-center justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h2", { className: "text-lg font-semibold tracking-tight", children: pageMessages.title }), _jsx("p", { className: "text-sm text-muted-foreground", children: pageMessages.description })] }), _jsxs(Button, { size: "sm", onClick: () => {
+                            setEditing(undefined);
+                            setSheetOpen(true);
+                        }, children: [_jsx(Plus, { className: "mr-1.5 size-3.5" }), pageMessages.addType] })] }), isPending ? (_jsx(ProductTypesListLoading, { loadingLabel: messages.common.loading })) : (_jsx("div", { className: "rounded-lg border bg-card text-card-foreground shadow-sm", children: items.length === 0 ? (_jsx("p", { className: "py-12 text-center text-sm text-muted-foreground", children: pageMessages.empty })) : (_jsx("div", { className: "flex flex-col divide-y", children: items.map((item) => (_jsxs("div", { className: "flex items-center justify-between gap-4 px-6 py-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("span", { className: "text-sm font-medium", children: item.name }), _jsx("span", { className: "font-mono text-xs text-muted-foreground", children: item.code }), !item.active ? (_jsx(Badge, { variant: "secondary", className: "text-xs", children: messages.common.inactive })) : null] }), item.description ? (_jsx("p", { className: "text-xs text-muted-foreground", children: item.description })) : null] }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon", className: "size-8 text-muted-foreground", children: _jsx(MoreHorizontal, { className: "size-4" }) }) }), _jsxs(DropdownMenuContent, { align: "end", children: [_jsxs(DropdownMenuItem, { onClick: () => {
+                                                    setEditing(item);
+                                                    setSheetOpen(true);
+                                                }, children: [_jsx(Pencil, { className: "size-4" }), pageMessages.edit] }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { variant: "destructive", onClick: () => {
+                                                    if (confirm(pageMessages.deleteConfirm)) {
+                                                        remove.mutate(item.id, { onSuccess: () => void refetch() });
+                                                    }
+                                                }, children: [_jsx(Trash2, { className: "size-4" }), pageMessages.delete] })] })] })] }, item.id))) })) })), _jsxs("div", { className: "flex items-center justify-between text-sm text-muted-foreground", children: [_jsx("span", { children: pageMessages.showingSummary
+                            .replace("{count}", String(items.length))
+                            .replace("{total}", String(total)) }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", size: "sm", disabled: pageIndex === 0, onClick: () => setPageIndex((current) => Math.max(0, current - 1)), children: messages.common.previous }), _jsxs("span", { children: [messages.common.page, " ", pageIndex + 1, " / ", pageCount] }), _jsx(Button, { variant: "outline", size: "sm", disabled: (pageIndex + 1) * pageSize >= total, onClick: () => setPageIndex((current) => current + 1), children: messages.common.next })] })] }), _jsx(ProductTypeSheet, { open: sheetOpen, onOpenChange: setSheetOpen, item: editing, onSuccess: () => {
+                    setSheetOpen(false);
+                    setEditing(undefined);
+                    void refetch();
+                } })] }));
+}
+function ProductTypesListLoading({ loadingLabel }) {
+    return (_jsx("div", { className: "rounded-lg border bg-card text-card-foreground shadow-sm", children: _jsxs("div", { className: "flex h-32 items-center justify-center text-sm text-muted-foreground", children: [_jsx(Loader2, { className: "mr-2 size-4 animate-spin" }), loadingLabel] }) }));
+}
+function ProductTypeSheet({ open, onOpenChange, item, onSuccess, }) {
+    const messages = useProductsUiMessagesOrDefault().productTypesPage;
+    const { create, update } = useProductTypeMutation();
+    const formSchema = useMemo(() => getFormSchema(messages), [messages]);
+    const form = useForm({
+        resolver: zodResolver(formSchema),
+        defaultValues: {
+            name: "",
+            code: "",
+            description: "",
+            sortOrder: 0,
+            active: true,
+        },
+    });
+    useEffect(() => {
+        if (open && item) {
+            form.reset({
+                name: item.name,
+                code: item.code,
+                description: item.description ?? "",
+                sortOrder: item.sortOrder,
+                active: item.active,
+            });
+        }
+        else if (open) {
+            form.reset();
+        }
+    }, [open, item, form]);
+    const isSubmitting = create.isPending || update.isPending;
+    const onSubmit = async (values) => {
+        const payload = {
+            name: values.name,
+            code: values.code,
+            description: values.description || null,
+            sortOrder: values.sortOrder,
+            active: values.active,
+        };
+        if (item) {
+            await update.mutateAsync({ id: item.id, input: payload });
+        }
+        else {
+            await create.mutateAsync(payload);
+        }
+        onSuccess();
+    };
+    return (_jsx(Sheet, { open: open, onOpenChange: onOpenChange, children: _jsxs(SheetContent, { side: "right", size: "lg", children: [_jsx(SheetHeader, { children: _jsx(SheetTitle, { children: item ? messages.editSheetTitle : messages.newSheetTitle }) }), _jsxs("form", { onSubmit: form.handleSubmit(onSubmit), className: "flex flex-1 flex-col overflow-hidden", children: [_jsxs(SheetBody, { className: "grid gap-4", children: [_jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: messages.nameLabel }), _jsx(Input, { ...form.register("name"), placeholder: messages.namePlaceholder, autoFocus: true }), form.formState.errors.name ? (_jsx("p", { className: "text-xs text-destructive", children: form.formState.errors.name.message })) : null] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: messages.codeLabel }), _jsx(Input, { ...form.register("code"), placeholder: messages.codePlaceholder }), form.formState.errors.code ? (_jsx("p", { className: "text-xs text-destructive", children: form.formState.errors.code.message })) : null] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: messages.descriptionLabel }), _jsx(Textarea, { ...form.register("description"), placeholder: messages.descriptionPlaceholder })] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: messages.sortOrderLabel }), _jsx(Input, { ...form.register("sortOrder"), type: "number" })] }), _jsxs("div", { className: "flex items-center gap-2 pt-6", children: [_jsx(Switch, { checked: form.watch("active"), onCheckedChange: (checked) => form.setValue("active", checked) }), _jsx(Label, { children: messages.activeLabel })] })] })] }), _jsxs(SheetFooter, { children: [_jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => onOpenChange(false), children: messages.cancel }), _jsxs(Button, { type: "submit", size: "sm", disabled: isSubmitting, children: [isSubmitting ? _jsx(Loader2, { className: "mr-2 size-4 animate-spin" }) : null, item ? messages.saveChanges : messages.createType] })] })] })] }) }));
+}

package/dist/components/product-version-dialog.d.ts

@@ -0,0 +1,8 @@
+export interface ProductVersionDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    productId: string;
+    onSuccess?: () => void;
+}
+export declare function ProductVersionDialog({ open, onOpenChange, productId, onSuccess, }: ProductVersionDialogProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-version-dialog.d.ts.map

package/dist/components/product-version-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-version-dialog.d.ts","sourceRoot":"","sources":["../../src/components/product-version-dialog.tsx"],"names":[],"mappings":"AAiBA,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED,wBAAgB,oBAAoB,CAAC,EACnC,IAAI,EACJ,YAAY,EACZ,SAAS,EACT,SAAS,GACV,EAAE,yBAAyB,2CAqE3B"}