@voyant-travel/finance-react 0.119.5

package/dist/components/booking-invoice-dialog.d.ts

@@ -0,0 +1,63 @@
+import { type BookingPaymentScheduleRecord, type InvoiceRecord } from "../index.js";
+export type InvoiceTypeChoice = "invoice" | "proforma";
+export interface BookingInvoiceDialogUpload {
+    storageKey: string;
+    mimeType: string;
+    fileSize: number;
+}
+export interface BookingInvoiceDueDateResolverInput {
+    issueDate: string;
+    dueDate: string;
+    invoiceType: InvoiceTypeChoice;
+    booking: {
+        id: string;
+        currency: string;
+        amountCents: number | null;
+    };
+    bookingPaymentSchedule: BookingPaymentScheduleRecord;
+}
+export type BookingInvoiceDueDateResolver = (input: BookingInvoiceDueDateResolverInput) => string;
+export interface BookingInvoiceDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    bookingId: string;
+    /** Pre-fill the currency from the booking's sell currency. */
+    defaultCurrency?: string;
+    /** Pre-fill subtotal/total from the booking's sell amount (in cents). */
+    defaultAmountCents?: number | null;
+    /**
+     * Upload a file's bytes to durable storage and return its location so
+     * the dialog can attach it to the newly-created invoice. When omitted,
+     * the attachments dropzone is hidden — the SmartBill-off branch can
+     * still create the invoice, it just won't surface uploads. The
+     * template owns the upload endpoint (e.g. `/api/v1/uploads`) so the
+     * dialog stays transport-agnostic.
+     */
+    uploadFile?: (file: File) => Promise<BookingInvoiceDialogUpload>;
+    /**
+     * Tax % to pre-fill on the schedule-derived line item. The operator
+     * template resolves this from the booking's primary product (e.g. via
+     * `useBookingTaxPreview`) so the dialog mirrors the rate the server
+     * would apply server-side at issuance. Defaults to 0 when omitted.
+     */
+    defaultScheduleTaxRatePercent?: number;
+    /**
+     * Resolve the legal document due date when an invoice/proforma is
+     * derived from a payment schedule. Defaults to the schedule due date
+     * for backwards compatibility.
+     */
+    resolveScheduleDueDate?: BookingInvoiceDueDateResolver;
+    onSuccess?: (invoice: InvoiceRecord) => void;
+}
+/**
+ * Modal invoice creator scoped to a single booking. Operators can pick
+ * between a free-form ("custom") invoice and one derived from an
+ * unpaid payment schedule (amounts + due date are locked to the
+ * schedule). Toggles control whether the new invoice is pushed to
+ * SmartBill on issue, whether a fully-paid `payments` row is created
+ * alongside it, and (when sync is off) lets the operator attach
+ * supporting documents.
+ */
+export declare function BookingInvoiceDialog({ open, onOpenChange, bookingId, defaultCurrency, // i18n-literal-ok domain default currency
+defaultAmountCents, uploadFile, defaultScheduleTaxRatePercent, resolveScheduleDueDate, onSuccess, }: BookingInvoiceDialogProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=booking-invoice-dialog.d.ts.map

package/dist/components/booking-invoice-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"booking-invoice-dialog.d.ts","sourceRoot":"","sources":["../../src/components/booking-invoice-dialog.tsx"],"names":[],"mappings":"AA0BA,OAAO,EACL,KAAK,4BAA4B,EACjC,KAAK,aAAa,EAKnB,MAAM,aAAa,CAAA;AAEpB,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,UAAU,CAAA;AAWtD,MAAM,WAAW,0BAA0B;IACzC,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;CACjB;AAED,MAAM,WAAW,kCAAkC;IACjD,SAAS,EAAE,MAAM,CAAA;IACjB,OAAO,EAAE,MAAM,CAAA;IACf,WAAW,EAAE,iBAAiB,CAAA;IAC9B,OAAO,EAAE;QACP,EAAE,EAAE,MAAM,CAAA;QACV,QAAQ,EAAE,MAAM,CAAA;QAChB,WAAW,EAAE,MAAM,GAAG,IAAI,CAAA;KAC3B,CAAA;IACD,sBAAsB,EAAE,4BAA4B,CAAA;CACrD;AAED,MAAM,MAAM,6BAA6B,GAAG,CAAC,KAAK,EAAE,kCAAkC,KAAK,MAAM,CAAA;AAEjG,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,SAAS,EAAE,MAAM,CAAA;IACjB,8DAA8D;IAC9D,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,yEAAyE;IACzE,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAClC;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,0BAA0B,CAAC,CAAA;IAChE;;;;;OAKG;IACH,6BAA6B,CAAC,EAAE,MAAM,CAAA;IACtC;;;;OAIG;IACH,sBAAsB,CAAC,EAAE,6BAA6B,CAAA;IACtD,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,IAAI,CAAA;CAC7C;AAgED;;;;;;;;GAQG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,IAAI,EACJ,YAAY,EACZ,SAAS,EACT,eAAuB,EAAE,0CAA0C;AACnE,kBAAyB,EACzB,UAAU,EACV,6BAAiC,EACjC,sBAAsB,EACtB,SAAS,GACV,EAAE,yBAAyB,2CAgsB3B"}

package/dist/components/booking-invoice-dialog.js

@@ -0,0 +1,383 @@
+// agent-quality: file-size exception -- owner: finance-react; existing UI surface stays co-located until a dedicated split preserves behavior and tests.
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, Input, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Switch, Textarea, } from "@voyant-travel/ui/components";
+import { CurrencyCombobox } from "@voyant-travel/ui/components/currency-combobox";
+import { CurrencyInput } from "@voyant-travel/ui/components/currency-input";
+import { DatePicker } from "@voyant-travel/ui/components/date-picker";
+import { Loader2, Paperclip, Plus, X } from "lucide-react";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { useFinanceUiMessagesOrDefault } from "../i18n/index.js";
+import { useBookingPaymentSchedules, useInvoiceMutation, useVoyantFinanceContext, } from "../index.js";
+function generateInvoiceNumber() {
+    const now = new Date();
+    const y = now.getFullYear();
+    const seq = String(Math.floor(Math.random() * 9000) + 1000);
+    return `INV-${y}-${seq}`; // i18n-literal-ok auto-generated id
+}
+function formatScheduleDate(iso, locale) {
+    try {
+        return new Date(iso).toLocaleDateString(locale, { dateStyle: "medium" });
+    }
+    catch {
+        return iso;
+    }
+}
+function formatMoney(cents, currency) {
+    try {
+        return new Intl.NumberFormat(undefined, { style: "currency", currency }).format(cents / 100);
+    }
+    catch {
+        return `${(cents / 100).toFixed(2)} ${currency}`;
+    }
+}
+// Persisted as the invoice's line-item description, which ships with the
+// PDF document itself. Voyant defaults to English at the data layer here;
+// templates that need a Romanian/etc. PDF supply their own description
+// resolver via the upcoming hook surface.
+const SCHEDULE_DESCRIPTION_FALLBACK = {
+    // i18n-literal-ok domain default for invoice line items
+    deposit: "Deposit",
+    // i18n-literal-ok domain default for invoice line items
+    installment: "Installment",
+    // i18n-literal-ok domain default for invoice line items
+    balance: "Balance",
+    // i18n-literal-ok domain default for invoice line items
+    hold: "Hold",
+    // i18n-literal-ok domain default for invoice line items
+    other: "Payment",
+};
+function scheduleDescription(scheduleType) {
+    // i18n-literal-ok matches SCHEDULE_DESCRIPTION_FALLBACK above
+    if (!scheduleType)
+        return SCHEDULE_DESCRIPTION_FALLBACK.other ?? "Payment";
+    return SCHEDULE_DESCRIPTION_FALLBACK[scheduleType] ?? scheduleType;
+}
+// CurrencyInput requires `onChange` even when disabled; this placeholder
+// keeps the read-only totals row from needing per-call wrappers.
+const noopCurrencyChange = (_value) => { };
+const PAYMENT_METHODS = [
+    "bank_transfer",
+    "credit_card",
+    "debit_card",
+    "cash",
+    "cheque",
+    "wallet",
+    "direct_bill",
+    "voucher",
+    "other",
+];
+/**
+ * Modal invoice creator scoped to a single booking. Operators can pick
+ * between a free-form ("custom") invoice and one derived from an
+ * unpaid payment schedule (amounts + due date are locked to the
+ * schedule). Toggles control whether the new invoice is pushed to
+ * SmartBill on issue, whether a fully-paid `payments` row is created
+ * alongside it, and (when sync is off) lets the operator attach
+ * supporting documents.
+ */
+export function BookingInvoiceDialog({ open, onOpenChange, bookingId, defaultCurrency = "EUR", // i18n-literal-ok domain default currency
+defaultAmountCents = null, uploadFile, defaultScheduleTaxRatePercent = 0, resolveScheduleDueDate, onSuccess, }) {
+    const { createFromBooking } = useInvoiceMutation();
+    const { baseUrl, fetcher } = useVoyantFinanceContext();
+    const messages = useFinanceUiMessagesOrDefault();
+    const dialog = messages.invoiceDialog;
+    const [invoiceType, setInvoiceType] = useState("invoice");
+    const [source, setSource] = useState("schedule");
+    const [scheduleId, setScheduleId] = useState(null);
+    const [invoiceNumber, setInvoiceNumber] = useState("");
+    const [currency, setCurrency] = useState(defaultCurrency);
+    const [subtotalCents, setSubtotalCents] = useState(defaultAmountCents ?? 0);
+    const [taxCents, setTaxCents] = useState(0);
+    const [totalCents, setTotalCents] = useState(defaultAmountCents ?? 0);
+    const [issueDate, setIssueDate] = useState("");
+    const [dueDate, setDueDate] = useState("");
+    const [notes, setNotes] = useState("");
+    const [lineItems, setLineItems] = useState([]);
+    const [syncToSmartbill, setSyncToSmartbill] = useState(true);
+    const [markAsPaid, setMarkAsPaid] = useState(false);
+    const [markAsPaidMethod, setMarkAsPaidMethod] = useState("bank_transfer");
+    const [markAsPaidDate, setMarkAsPaidDate] = useState("");
+    const [attachments, setAttachments] = useState([]);
+    const [submitting, setSubmitting] = useState(false);
+    const [error, setError] = useState(null);
+    // ---- prefill / reset on open ---------------------------------------------
+    useEffect(() => {
+        if (!open)
+            return;
+        const today = new Date().toISOString().split("T")[0] ?? "";
+        setInvoiceType("invoice");
+        setSource("schedule");
+        setScheduleId(null);
+        setInvoiceNumber(generateInvoiceNumber());
+        setCurrency(defaultCurrency);
+        setSubtotalCents(defaultAmountCents ?? 0);
+        setTaxCents(0);
+        setTotalCents(defaultAmountCents ?? 0);
+        setIssueDate(today);
+        setDueDate("");
+        setNotes("");
+        setLineItems([]);
+        setSyncToSmartbill(true);
+        setMarkAsPaid(false);
+        setMarkAsPaidMethod("bank_transfer");
+        setMarkAsPaidDate(today);
+        setAttachments([]);
+        setSubmitting(false);
+        setError(null);
+    }, [open, defaultCurrency, defaultAmountCents]);
+    // ---- schedules -----------------------------------------------------------
+    const schedulesQuery = useBookingPaymentSchedules(bookingId, { enabled: open });
+    const unpaidSchedules = useMemo(() => (schedulesQuery.data?.data ?? []).filter((s) => s.status === "pending" || s.status === "due"), [schedulesQuery.data]);
+    // When the operator picks a schedule, lock the financial fields to it.
+    // `useMemo` keeps the lookup cheap on every render.
+    const selectedSchedule = useMemo(() => (scheduleId ? (unpaidSchedules.find((s) => s.id === scheduleId) ?? null) : null), [scheduleId, unpaidSchedules]);
+    useEffect(() => {
+        if (source !== "schedule") {
+            // Leaving the schedule branch — wipe the auto-prefilled line items
+            // so the operator's blank "Custom" slate stays blank.
+            setLineItems([]);
+            return;
+        }
+        if (!selectedSchedule) {
+            setLineItems([]);
+            return;
+        }
+        setCurrency(selectedSchedule.currency);
+        // The schedule amount is the gross (customer-facing) sum, so the
+        // line item's net unit price is `amount / (1 + tax%)`. Without this
+        // back-out the line would compute as `amount + amount * tax%`,
+        // making the invoice exceed what the customer is actually paying.
+        const taxFactor = 1 + Math.max(0, defaultScheduleTaxRatePercent) / 100;
+        const netUnitAmount = taxFactor > 0
+            ? Math.round(selectedSchedule.amountCents / taxFactor)
+            : selectedSchedule.amountCents;
+        setLineItems([
+            {
+                id: `schedule_${selectedSchedule.id}`,
+                description: scheduleDescription(selectedSchedule.scheduleType),
+                quantity: 1,
+                unitAmountCents: netUnitAmount,
+                taxRatePercent: defaultScheduleTaxRatePercent,
+            },
+        ]);
+    }, [source, selectedSchedule, defaultScheduleTaxRatePercent]);
+    useEffect(() => {
+        if (source !== "schedule" || !selectedSchedule)
+            return;
+        setDueDate(resolveScheduleDueDate?.({
+            issueDate,
+            dueDate: selectedSchedule.dueDate,
+            invoiceType,
+            booking: {
+                id: bookingId,
+                currency: defaultCurrency,
+                amountCents: defaultAmountCents,
+            },
+            bookingPaymentSchedule: selectedSchedule,
+        }) ?? selectedSchedule.dueDate);
+    }, [
+        source,
+        selectedSchedule,
+        resolveScheduleDueDate,
+        issueDate,
+        invoiceType,
+        bookingId,
+        defaultCurrency,
+        defaultAmountCents,
+    ]);
+    // ---- line item totals ----------------------------------------------------
+    // When the operator entered explicit line items, the global Subtotal/Tax/
+    // Total fields become a read-only summary of the sum across rows.
+    const lineItemTotals = useMemo(() => {
+        let subtotal = 0;
+        let tax = 0;
+        for (const line of lineItems) {
+            const lineSubtotal = Math.max(0, Math.round(line.quantity * line.unitAmountCents));
+            const lineTax = Math.max(0, Math.round((lineSubtotal * line.taxRatePercent) / 100));
+            subtotal += lineSubtotal;
+            tax += lineTax;
+        }
+        return { subtotalCents: subtotal, taxCents: tax, totalCents: subtotal + tax };
+    }, [lineItems]);
+    // Subtotal/Tax/Total are always derived from the line items, so reflect
+    // the latest computation on every render (including the empty → 0 case).
+    useEffect(() => {
+        setSubtotalCents(lineItemTotals.subtotalCents);
+        setTaxCents(lineItemTotals.taxCents);
+        setTotalCents(lineItemTotals.totalCents);
+    }, [lineItemTotals]);
+    const scheduleLocked = source === "schedule" && selectedSchedule != null;
+    const linesDriveTotals = source === "custom" && lineItems.length > 0;
+    // ---- submit --------------------------------------------------------------
+    const submit = useCallback(async () => {
+        if (submitting)
+            return;
+        setError(null);
+        if (source === "schedule" && !selectedSchedule) {
+            setError(dialog.schedulePlaceholder);
+            return;
+        }
+        if (!issueDate) {
+            setError(dialog.validation.issueDateRequired);
+            return;
+        }
+        if (!dueDate) {
+            setError(dialog.validation.dueDateRequired);
+            return;
+        }
+        if (linesDriveTotals) {
+            const invalid = lineItems.find((line) => !line.description.trim() || line.quantity < 1);
+            if (invalid) {
+                setError(dialog.validation.lineItemInvalid);
+                return;
+            }
+        }
+        setSubmitting(true);
+        try {
+            // Subtotal/Tax/Total are intentionally omitted — the server
+            // computes them from `lineItems` (custom mode) or from the linked
+            // schedule (schedule mode). Sending the locally-derived numbers
+            // can drift by 1 cent due to rounding and trips the strict
+            // "Invoice tax does not match line items" cross-check.
+            const created = await createFromBooking.mutateAsync({
+                bookingId,
+                bookingPaymentScheduleId: selectedSchedule?.id,
+                invoiceNumber,
+                issueDate,
+                dueDate,
+                currency,
+                notes: notes || null,
+                invoiceType,
+                skipExternalSync: !syncToSmartbill,
+                lineItems: linesDriveTotals
+                    ? lineItems.map((line) => ({
+                        description: line.description.trim(),
+                        quantity: line.quantity,
+                        unitAmountCents: line.unitAmountCents,
+                        taxRateBps: line.taxRatePercent > 0 ? Math.round(line.taxRatePercent * 100) : undefined,
+                    }))
+                    : undefined,
+            });
+            // Fully-paid sibling payment row. Use the totals returned by the
+            // server (which may differ from the locally-derived ones by a cent
+            // due to schedule tax back-out / rounding) — paying the local
+            // figure can leave the invoice short and break the one-click
+            // "Mark as paid" expectation (incl. proforma conversion triggers).
+            if (markAsPaid && created.totalCents > 0) {
+                const paymentDate = markAsPaidDate || new Date().toISOString().split("T")[0] || issueDate;
+                await fetcher(`${baseUrl}/v1/admin/finance/invoices/${created.id}/payments`, {
+                    method: "POST",
+                    headers: { "Content-Type": "application/json" },
+                    body: JSON.stringify({
+                        amountCents: created.totalCents,
+                        currency: created.currency,
+                        paymentMethod: markAsPaidMethod,
+                        status: "completed",
+                        paymentDate,
+                    }),
+                });
+            }
+            // Attachments: upload bytes via the template-supplied uploader,
+            // then register each as an `invoice_attachment` row pointing at
+            // the storage key returned by the upload.
+            if (uploadFile && attachments.length > 0) {
+                for (const file of attachments) {
+                    const uploaded = await uploadFile(file);
+                    await fetcher(`${baseUrl}/v1/admin/finance/invoices/${created.id}/attachments`, {
+                        method: "POST",
+                        headers: { "Content-Type": "application/json" },
+                        body: JSON.stringify({
+                            kind: "supporting_document",
+                            name: file.name,
+                            mimeType: uploaded.mimeType || file.type || null,
+                            fileSize: uploaded.fileSize ?? file.size,
+                            storageKey: uploaded.storageKey,
+                        }),
+                    });
+                }
+            }
+            onSuccess?.(created);
+            onOpenChange(false);
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : String(err));
+        }
+        finally {
+            setSubmitting(false);
+        }
+    }, [
+        submitting,
+        source,
+        selectedSchedule,
+        issueDate,
+        dueDate,
+        createFromBooking,
+        bookingId,
+        invoiceNumber,
+        currency,
+        notes,
+        invoiceType,
+        syncToSmartbill,
+        markAsPaid,
+        markAsPaidMethod,
+        markAsPaidDate,
+        attachments,
+        uploadFile,
+        baseUrl,
+        fetcher,
+        onSuccess,
+        onOpenChange,
+        linesDriveTotals,
+        lineItems,
+        dialog,
+    ]);
+    // ---- render --------------------------------------------------------------
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "w-full! max-w-3xl! gap-0 p-0", children: [_jsxs(DialogHeader, { className: "shrink-0 border-b px-6 py-4", children: [_jsx(DialogTitle, { children: dialog.titles.create }), _jsx(DialogDescription, { children: messages.invoicesPage.description })] }), _jsx("div", { className: "max-h-[70vh] overflow-y-auto", children: _jsxs("div", { className: "flex flex-col gap-4 px-6 py-5", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.type }), _jsx(SegmentedChoice, { value: invoiceType, onChange: setInvoiceType, options: [
+                                            { value: "invoice", label: dialog.typeLabels.invoice },
+                                            { value: "proforma", label: dialog.typeLabels.proforma },
+                                        ] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.source }), _jsx(SegmentedChoice, { value: source, onChange: (next) => {
+                                            setSource(next);
+                                            if (next === "custom")
+                                                setScheduleId(null);
+                                        }, options: [
+                                            { value: "schedule", label: dialog.sourceLabels.schedule },
+                                            { value: "custom", label: dialog.sourceLabels.custom },
+                                        ] })] }), _jsxs("div", { className: "flex items-center justify-between gap-3 rounded-md border bg-muted/20 px-4 py-3", children: [_jsx(Label, { className: "cursor-pointer", onClick: () => setSyncToSmartbill((v) => !v), children: dialog.fields.syncToSmartbill }), _jsx(Switch, { checked: syncToSmartbill, onCheckedChange: setSyncToSmartbill })] }), source === "schedule" ? (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.schedule }), _jsxs(Select, { value: scheduleId ?? undefined, onValueChange: (v) => setScheduleId(v ?? null), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: dialog.schedulePlaceholder }) }), _jsx(SelectContent, { children: unpaidSchedules.length === 0 ? (_jsx("div", { className: "px-3 py-2 text-sm text-muted-foreground", children: dialog.scheduleEmpty })) : (unpaidSchedules.map((s) => (_jsxs(SelectItem, { value: s.id, children: [formatScheduleDate(s.dueDate, undefined), " \u00B7", " ", formatMoney(s.amountCents, s.currency)] }, s.id)))) })] }), scheduleLocked ? (_jsx("p", { className: "text-xs text-muted-foreground", children: dialog.scheduleLockedHint })) : null] })) : null, _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.invoiceNumber }), _jsx(Input, { value: invoiceNumber, onChange: (e) => setInvoiceNumber(e.target.value), placeholder: dialog.placeholders.invoiceNumber, disabled: syncToSmartbill }), syncToSmartbill ? (_jsx("p", { className: "text-xs text-muted-foreground", children: dialog.invoiceNumberAutoHint })) : null] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.currency }), _jsx(CurrencyCombobox, { value: currency, onChange: (next) => setCurrency(next ?? defaultCurrency), disabled: scheduleLocked })] })] }), source === "custom" || lineItems.length > 0 ? (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx(Label, { children: dialog.lineItems.sectionTitle }), source === "custom" ? (_jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setLineItems((prev) => [
+                                                    ...prev,
+                                                    {
+                                                        id: `tmp_${Date.now()}_${prev.length}`,
+                                                        description: "",
+                                                        quantity: 1,
+                                                        unitAmountCents: 0,
+                                                        taxRatePercent: 0,
+                                                    },
+                                                ]), children: [_jsx(Plus, { className: "mr-1 h-3.5 w-3.5" }), dialog.lineItems.addRow] })) : null] }), lineItems.length === 0 ? (_jsx("p", { className: "text-xs text-muted-foreground", children: dialog.lineItems.empty })) : (_jsx("div", { className: "flex flex-col gap-2", children: lineItems.map((line, idx) => {
+                                            const lineSubtotal = Math.max(0, Math.round(line.quantity * line.unitAmountCents));
+                                            const lineTotal = lineSubtotal +
+                                                Math.max(0, Math.round((lineSubtotal * line.taxRatePercent) / 100));
+                                            return (_jsxs("div", { className: "grid grid-cols-[1fr_3rem_7rem_4rem_6rem_2rem] items-end gap-2 rounded-md border bg-background p-2", children: [_jsxs("div", { className: "flex flex-col gap-1", children: [idx === 0 ? (_jsx(Label, { className: "text-xs", children: dialog.lineItems.description })) : null, _jsx(Input, { value: line.description, onChange: (e) => setLineItems((prev) => prev.map((row, i) => i === idx ? { ...row, description: e.target.value } : row)), disabled: scheduleLocked })] }), _jsxs("div", { className: "flex flex-col gap-1", children: [idx === 0 ? (_jsx(Label, { className: "text-xs", children: dialog.lineItems.quantity })) : null, _jsx(Input, { type: "number", min: 1, value: line.quantity, onChange: (e) => setLineItems((prev) => prev.map((row, i) => i === idx
+                                                                    ? {
+                                                                        ...row,
+                                                                        quantity: Math.max(1, Number(e.target.value) || 1),
+                                                                    }
+                                                                    : row)), disabled: scheduleLocked })] }), _jsxs("div", { className: "flex flex-col gap-1", children: [idx === 0 ? (_jsx(Label, { className: "text-xs", children: dialog.lineItems.unitPrice })) : null, _jsx(CurrencyInput, { value: line.unitAmountCents, onChange: (next) => setLineItems((prev) => prev.map((row, i) => i === idx ? { ...row, unitAmountCents: next ?? 0 } : row)), currency: currency, disabled: scheduleLocked })] }), _jsxs("div", { className: "flex flex-col gap-1", children: [idx === 0 ? (_jsx(Label, { className: "text-xs", children: dialog.lineItems.taxPercent })) : null, _jsx(Input, { type: "number", min: 0, max: 100, step: 0.01, value: line.taxRatePercent, onChange: (e) => setLineItems((prev) => prev.map((row, i) => i === idx
+                                                                    ? {
+                                                                        ...row,
+                                                                        taxRatePercent: Math.max(0, Math.min(100, Number(e.target.value) || 0)),
+                                                                    }
+                                                                    : row)), disabled: scheduleLocked })] }), _jsxs("div", { className: "flex flex-col gap-1", children: [idx === 0 ? (_jsx(Label, { className: "text-xs", children: dialog.lineItems.lineTotal })) : null, _jsx("div", { className: "px-2 py-1.5 text-right font-mono text-sm", children: formatMoney(lineTotal, currency) })] }), scheduleLocked ? (_jsx("div", {})) : (_jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", "aria-label": dialog.lineItems.remove, onClick: () => setLineItems((prev) => prev.filter((_, i) => i !== idx)), children: _jsx(X, { className: "h-3.5 w-3.5" }) }))] }, line.id));
+                                        }) }))] })) : null, _jsxs("div", { className: "grid grid-cols-3 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.subtotalCents }), _jsx(CurrencyInput, { value: subtotalCents, onChange: noopCurrencyChange, currency: currency, disabled: true })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.taxCents }), _jsx(CurrencyInput, { value: taxCents, onChange: noopCurrencyChange, currency: currency, disabled: true })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.totalCents }), _jsx(CurrencyInput, { value: totalCents, onChange: noopCurrencyChange, currency: currency, disabled: true })] })] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.issueDate }), _jsx(DatePicker, { value: issueDate || null, onChange: (next) => setIssueDate(next ?? ""), placeholder: dialog.placeholders.issueDate, className: "w-full" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.dueDate }), _jsx(DatePicker, { value: dueDate || null, onChange: (next) => setDueDate(next ?? ""), placeholder: dialog.placeholders.dueDate, className: "w-full", disabled: scheduleLocked })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.notes }), _jsx(Textarea, { value: notes, onChange: (e) => setNotes(e.target.value), placeholder: dialog.placeholders.notes })] }), _jsxs("div", { className: "flex flex-col gap-3 rounded-md border bg-muted/20 px-4 py-3", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsx(Label, { className: "cursor-pointer", onClick: () => setMarkAsPaid((v) => !v), children: dialog.fields.markAsPaid }), _jsx(Switch, { checked: markAsPaid, onCheckedChange: setMarkAsPaid })] }), markAsPaid ? (_jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.markAsPaidMethod }), _jsxs(Select, { value: markAsPaidMethod, onValueChange: (v) => setMarkAsPaidMethod((v ?? "bank_transfer")), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: PAYMENT_METHODS.map((method) => (_jsx(SelectItem, { value: method, children: messages.common.paymentMethodLabels[method] }, method))) })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.markAsPaidDate }), _jsx(DatePicker, { value: markAsPaidDate || null, onChange: (next) => setMarkAsPaidDate(next ?? ""), placeholder: dialog.placeholders.issueDate, className: "w-full" })] })] })) : null] }), !syncToSmartbill && uploadFile ? (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: dialog.fields.attachments }), _jsx("p", { className: "text-xs text-muted-foreground", children: dialog.attachmentsHint }), _jsx("input", { type: "file", multiple: true, onChange: (e) => {
+                                            const files = Array.from(e.target.files ?? []);
+                                            if (files.length > 0)
+                                                setAttachments((prev) => [...prev, ...files]);
+                                            e.target.value = "";
+                                        }, className: "block w-full text-sm file:mr-3 file:rounded-md file:border file:bg-muted file:px-3 file:py-1.5 file:text-sm file:font-medium hover:file:bg-muted/70" }), attachments.length > 0 ? (_jsx("ul", { className: "flex flex-col gap-1", children: attachments.map((file, idx) => (_jsxs("li", { className: "flex items-center justify-between gap-2 rounded-md border bg-background px-3 py-1.5 text-sm", children: [_jsxs("span", { className: "flex min-w-0 items-center gap-2", children: [_jsx(Paperclip, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }), _jsx("span", { className: "truncate", children: file.name })] }), _jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", onClick: () => setAttachments((prev) => prev.filter((_, i) => i !== idx)), children: _jsx(X, { className: "h-3.5 w-3.5" }) })] }, `${file.name}-${idx}`))) })) : null] })) : null, error ? _jsx("p", { className: "text-sm text-destructive", children: error }) : null] }) }), _jsxs("div", { className: "flex shrink-0 items-center justify-end gap-2 border-t px-6 py-4", children: [_jsx(Button, { type: "button", variant: "outline", onClick: () => onOpenChange(false), disabled: submitting, children: messages.common.cancel }), _jsxs(Button, { type: "button", disabled: submitting, onClick: () => void submit(), children: [submitting ? _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }) : null, dialog.actions.create] })] })] }) }));
+}
+function SegmentedChoice({ value, onChange, options, }) {
+    return (_jsx("div", { className: "flex w-full rounded-md border bg-background p-0.5", children: options.map((opt) => {
+            const active = opt.value === value;
+            return (_jsx("button", { type: "button", onClick: () => onChange(opt.value), className: "flex-1 rounded-sm px-3 py-1.5 text-sm font-medium transition-colors " +
+                    (active ? "bg-muted text-foreground" : "text-muted-foreground hover:text-foreground"), children: opt.label }, opt.value));
+        }) }));
+}

package/dist/components/cost-categories-page.d.ts

@@ -0,0 +1,5 @@
+export interface CostCategoriesPageProps {
+    className?: string;
+}
+export declare function CostCategoriesPage({ className }?: CostCategoriesPageProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=cost-categories-page.d.ts.map

package/dist/components/cost-categories-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cost-categories-page.d.ts","sourceRoot":"","sources":["../../src/components/cost-categories-page.tsx"],"names":[],"mappings":"AAiBA,MAAM,WAAW,uBAAuB;IACtC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAE,uBAA4B,2CA8F7E"}

package/dist/components/cost-categories-page.js

@@ -0,0 +1,30 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge, Button, Checkbox, Input, Label } from "@voyant-travel/ui/components";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "@voyant-travel/ui/components/table";
+import { cn } from "@voyant-travel/ui/lib/utils";
+import { Plus } from "lucide-react";
+import { useState } from "react";
+import { useFinanceUiMessagesOrDefault } from "../i18n/index.js";
+import { useCostCategories, useCostCategoryMutation } from "../index.js";
+export function CostCategoriesPage({ className } = {}) {
+    const t = useFinanceUiMessagesOrDefault().costCategories;
+    const [showArchived, setShowArchived] = useState(false);
+    const [name, setName] = useState("");
+    const categories = useCostCategories({ includeArchived: showArchived });
+    const { create, update } = useCostCategoryMutation();
+    const rows = categories.data?.data ?? [];
+    const add = () => {
+        const trimmed = name.trim();
+        if (!trimmed)
+            return;
+        create.mutate({ name: trimmed }, { onSuccess: () => setName("") });
+    };
+    return (_jsxs("div", { className: cn("flex flex-col gap-6 p-6", className), children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-bold tracking-tight", children: t.title }), _jsx("p", { className: "text-sm text-muted-foreground", children: t.description })] }), _jsxs("div", { className: "flex max-w-md items-end gap-2", children: [_jsx(Input, { placeholder: t.namePlaceholder, value: name, onChange: (e) => setName(e.target.value), onKeyDown: (e) => {
+                            if (e.key === "Enter")
+                                add();
+                        } }), _jsxs(Button, { onClick: add, disabled: create.isPending || !name.trim(), children: [_jsx(Plus, { className: "size-4" }), create.isPending ? t.adding : t.add] })] }), _jsxs(Label, { className: "flex items-center gap-2 text-sm font-normal text-muted-foreground", children: [_jsx(Checkbox, { checked: showArchived, onCheckedChange: (checked) => setShowArchived(checked === true) }), t.showArchived] }), _jsx("div", { className: "max-w-2xl rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: t.namePlaceholder }), _jsx(TableHead, { className: "w-32 text-right" })] }) }), _jsx(TableBody, { children: rows.length === 0 ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 2, className: "text-center text-muted-foreground", children: t.empty }) })) : (rows.map((category) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { className: "font-medium", children: [category.name, category.archived ? (_jsx(Badge, { variant: "outline", className: "ml-2", children: t.archivedBadge })) : null] }), _jsx(TableCell, { className: "text-right", children: _jsx(Button, { variant: "ghost", size: "sm", disabled: update.isPending, onClick: () => update.mutate({
+                                                id: category.id,
+                                                input: { archived: !category.archived },
+                                            }), children: category.archived ? t.restore : t.archive }) })] }, category.id)))) })] }) })] }));
+}

package/dist/components/invoice-action-ledger-card.d.ts

@@ -0,0 +1,15 @@
+export interface InvoiceActionLedgerCardProps {
+    invoiceId: string;
+    limit?: number;
+    className?: string;
+}
+export declare function InvoiceActionLedgerCard({ invoiceId, limit, className, }: InvoiceActionLedgerCardProps): import("react/jsx-runtime").JSX.Element;
+export interface PaymentSessionActionLedgerCardProps {
+    paymentSessionId: string;
+    limit?: number;
+    className?: string;
+}
+export declare function PaymentSessionActionLedgerCard({ paymentSessionId, limit, className, }: PaymentSessionActionLedgerCardProps): import("react/jsx-runtime").JSX.Element;
+export declare const actionLedgerStatusVariant: Record<string, "default" | "secondary" | "outline" | "destructive">;
+export declare const actionLedgerRiskVariant: Record<string, "default" | "secondary" | "outline" | "destructive">;
+//# sourceMappingURL=invoice-action-ledger-card.d.ts.map

package/dist/components/invoice-action-ledger-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"invoice-action-ledger-card.d.ts","sourceRoot":"","sources":["../../src/components/invoice-action-ledger-card.tsx"],"names":[],"mappings":"AAUA,MAAM,WAAW,4BAA4B;IAC3C,SAAS,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,KAAU,EACV,SAAS,GACV,EAAE,4BAA4B,2CAoB9B;AAED,MAAM,WAAW,mCAAmC;IAClD,gBAAgB,EAAE,MAAM,CAAA;IACxB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,8BAA8B,CAAC,EAC7C,gBAAgB,EAChB,KAAU,EACV,SAAS,GACV,EAAE,mCAAmC,2CAoBrC;AA4JD,eAAO,MAAM,yBAAyB,EAAE,MAAM,CAC5C,MAAM,EACN,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,aAAa,CAapD,CAAA;AAED,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAC1C,MAAM,EACN,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,aAAa,CAMpD,CAAA"}

package/dist/components/invoice-action-ledger-card.js

@@ -0,0 +1,76 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge, Button } from "@voyant-travel/ui/components";
+import { cn } from "@voyant-travel/ui/lib/utils";
+import { Activity, Loader2 } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useFinanceUiI18nOrDefault, useFinanceUiMessagesOrDefault } from "../i18n/index.js";
+import { useInvoiceActionLedger, usePaymentSessionActionLedger } from "../index.js";
+export function InvoiceActionLedgerCard({ invoiceId, limit = 20, className, }) {
+    const messages = useFinanceUiMessagesOrDefault();
+    const detail = messages.invoiceDetailPage;
+    const [cursor, setCursor] = useState(null);
+    const actionLedgerQuery = useInvoiceActionLedger(invoiceId, { cursor, limit });
+    return (_jsx(FinanceActionLedgerCard, { dataSlot: "invoice-action-ledger-card", title: detail.titles.actionLedger, loadOlderLabel: detail.actions.loadOlderActionLedger, emptyLabel: detail.states.noActionLedger, loadFailedLabel: detail.states.actionLedgerLoadFailed, className: className, cursor: cursor, setCursor: setCursor, query: actionLedgerQuery }));
+}
+export function PaymentSessionActionLedgerCard({ paymentSessionId, limit = 20, className, }) {
+    const messages = useFinanceUiMessagesOrDefault();
+    const detail = messages.invoiceDetailPage;
+    const [cursor, setCursor] = useState(null);
+    const actionLedgerQuery = usePaymentSessionActionLedger(paymentSessionId, { cursor, limit });
+    return (_jsx(FinanceActionLedgerCard, { dataSlot: "payment-session-action-ledger-card", title: detail.titles.actionLedger, loadOlderLabel: detail.actions.loadOlderActionLedger, emptyLabel: detail.states.noActionLedger, loadFailedLabel: detail.states.actionLedgerLoadFailed, className: className, cursor: cursor, setCursor: setCursor, query: actionLedgerQuery }));
+}
+function FinanceActionLedgerCard({ dataSlot, title, loadOlderLabel, emptyLabel, loadFailedLabel, className, cursor, setCursor, query, }) {
+    const { formatDateTime } = useFinanceUiI18nOrDefault();
+    const [pages, setPages] = useState([]);
+    useEffect(() => {
+        const page = query.data;
+        if (!page)
+            return;
+        setPages((currentPages) => {
+            if (currentPages.some((currentPage) => currentPage.data[0]?.id === page.data[0]?.id)) {
+                return currentPages;
+            }
+            return cursor ? [...currentPages, page] : [page];
+        });
+    }, [query.data, cursor]);
+    const entries = pages.flatMap((page) => page.data);
+    const nextCursor = pages.at(-1)?.pageInfo.nextCursor ?? null;
+    return (_jsx(ActionLedgerSection, { dataSlot: dataSlot, title: title, className: className, children: query.isPending && entries.length === 0 ? (_jsx(ActionLedgerLoadingRow, {})) : query.isError && entries.length === 0 ? (_jsx(ActionLedgerEmptyRow, { children: loadFailedLabel })) : entries.length === 0 ? (_jsx(ActionLedgerEmptyRow, { children: emptyLabel })) : (_jsxs("div", { className: "flex flex-col gap-3", children: [_jsx("ul", { className: "divide-y rounded-md border bg-background", children: entries.map((entry) => (_jsx(InvoiceActionLedgerEntryItem, { entry: entry, timestamp: formatDateTime(entry.occurredAt) }, entry.id))) }), nextCursor ? (_jsxs(Button, { type: "button", variant: "outline", size: "sm", className: "self-start", disabled: query.isFetching, onClick: () => setCursor(nextCursor), children: [query.isFetching ? (_jsx(Loader2, { className: "size-4 animate-spin", "aria-hidden": "true" })) : null, loadOlderLabel] })) : null] })) }));
+}
+function InvoiceActionLedgerEntryItem({ entry, timestamp, }) {
+    return (_jsxs("li", { className: "flex items-start gap-3 p-3", children: [_jsx(Activity, { className: "mt-0.5 size-4 shrink-0 text-muted-foreground", "aria-hidden": "true" }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("p", { className: "truncate font-medium text-sm", children: formatActionLedgerName(entry.actionName) }), _jsx(Badge, { variant: actionLedgerStatusVariant[entry.status] ?? "secondary", children: entry.status.replace(/_/g, " ") }), _jsx(Badge, { variant: actionLedgerRiskVariant[entry.evaluatedRisk] ?? "outline", children: entry.evaluatedRisk })] }), _jsxs("p", { className: "mt-1 text-muted-foreground text-xs", children: [entry.principalType, ":", entry.principalId, " - ", timestamp] }), entry.mutationSummary ? (_jsx("p", { className: "mt-1 truncate text-muted-foreground text-xs", children: entry.mutationSummary })) : null, _jsxs("p", { className: "mt-1 truncate font-mono text-muted-foreground text-xs", children: [entry.targetType, ":", entry.targetId] })] })] }));
+}
+function ActionLedgerSection({ dataSlot, title, children, className, }) {
+    return (_jsxs("section", { "data-slot": dataSlot, className: cn("rounded-md border bg-background", className), children: [_jsx("div", { className: "flex flex-wrap items-center justify-between gap-3 border-b px-4 py-3", children: _jsx("h2", { className: "font-semibold text-sm", children: title }) }), _jsx("div", { className: "p-4", children: children })] }));
+}
+function ActionLedgerEmptyRow({ children }) {
+    return _jsx("p", { className: "py-6 text-center text-sm text-muted-foreground", children: children });
+}
+function ActionLedgerLoadingRow() {
+    return (_jsx("div", { className: "flex justify-center py-6", children: _jsx(Loader2, { className: "size-5 animate-spin text-muted-foreground" }) }));
+}
+function formatActionLedgerName(actionName) {
+    const withoutDomain = actionName.replace(/^finance\./, "");
+    const label = withoutDomain.replace(/[._-]/g, " ");
+    return label.charAt(0).toUpperCase() + label.slice(1);
+}
+export const actionLedgerStatusVariant = {
+    requested: "outline",
+    awaiting_approval: "secondary",
+    approved: "secondary",
+    denied: "destructive",
+    succeeded: "default",
+    failed: "destructive",
+    reversed: "secondary",
+    compensated: "secondary",
+    expired: "secondary",
+    cancelled: "secondary",
+    superseded: "secondary",
+};
+export const actionLedgerRiskVariant = {
+    low: "outline",
+    medium: "secondary",
+    high: "destructive",
+    critical: "destructive",
+};

package/dist/components/invoice-bulk-actions.d.ts

@@ -0,0 +1,10 @@
+import type { InvoiceBulkStatusResult } from "../index.js";
+export interface InvoiceBulkActionsProps {
+    selectedCount: number;
+    result: InvoiceBulkStatusResult | null;
+    pending: boolean;
+    onClear: () => void;
+    onMarkPaid: () => unknown;
+}
+export declare function InvoiceBulkActions({ selectedCount, result, pending, onClear, onMarkPaid, }: InvoiceBulkActionsProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=invoice-bulk-actions.d.ts.map

package/dist/components/invoice-bulk-actions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"invoice-bulk-actions.d.ts","sourceRoot":"","sources":["../../src/components/invoice-bulk-actions.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAA;AAE1D,MAAM,WAAW,uBAAuB;IACtC,aAAa,EAAE,MAAM,CAAA;IACrB,MAAM,EAAE,uBAAuB,GAAG,IAAI,CAAA;IACtC,OAAO,EAAE,OAAO,CAAA;IAChB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,UAAU,EAAE,MAAM,OAAO,CAAA;CAC1B;AAED,wBAAgB,kBAAkB,CAAC,EACjC,aAAa,EACb,MAAM,EACN,OAAO,EACP,OAAO,EACP,UAAU,GACX,EAAE,uBAAuB,2CAkDzB"}