@voyant-travel/finance-react 0.119.5

package/dist/checkout-ui.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkout-ui.d.ts","sourceRoot":"","sources":["../src/checkout-ui.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EACpB,KAAK,yBAAyB,GAC/B,MAAM,iDAAiD,CAAA;AACxD,OAAO,EACL,KAAK,wBAAwB,EAC7B,sBAAsB,EACtB,KAAK,2BAA2B,GACjC,MAAM,oDAAoD,CAAA;AAC3D,OAAO,EACL,WAAW,EACX,KAAK,sBAAsB,EAC3B,KAAK,gBAAgB,GACtB,MAAM,uCAAuC,CAAA;AAC9C,YAAY,EAAE,yBAAyB,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAA;AAC7F,OAAO,EACL,KAAK,0BAA0B,EAC/B,0BAA0B,EAC1B,4BAA4B,EAC5B,iBAAiB,EACjB,yBAAyB,EACzB,iBAAiB,EACjB,0BAA0B,EAC1B,qBAAqB,EACrB,8BAA8B,GAC/B,MAAM,0BAA0B,CAAA;AACjC,YAAY,EACV,aAAa,EACb,uBAAuB,EACvB,mBAAmB,GACpB,MAAM,qBAAqB,CAAA"}

package/dist/checkout-ui.js

@@ -0,0 +1,4 @@
+export { CollectPaymentDialog, } from "./checkout-components/collect-payment-dialog.js";
+export { PaymentLinkLandingPage, } from "./checkout-components/payment-link-landing-page.js";
+export { PaymentStep, } from "./checkout-components/payment-step.js";
+export { CheckoutUiMessagesProvider, checkoutUiMessageDefinitions, getCheckoutUiI18n, resolveCheckoutUiMessages, useCheckoutUiI18n, useCheckoutUiI18nOrDefault, useCheckoutUiMessages, useCheckoutUiMessagesOrDefault, } from "./checkout-i18n/index.js";

package/dist/checkout.d.ts

@@ -0,0 +1,5 @@
+export * from "./checkout-hooks/index.js";
+export * from "./checkout-i18n/index.js";
+export type { PaymentChoice, PaymentStepCapabilities, PaymentStepExtraOption, SavedPaymentAccount, } from "./checkout-types.js";
+export { useVoyantFinanceContext, type VoyantFinanceContextValue, VoyantFinanceProvider, type VoyantFinanceProviderProps, } from "./provider.js";
+//# sourceMappingURL=checkout.d.ts.map

package/dist/checkout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkout.d.ts","sourceRoot":"","sources":["../src/checkout.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAA;AACzC,cAAc,0BAA0B,CAAA;AACxC,YAAY,EACV,aAAa,EACb,uBAAuB,EACvB,sBAAsB,EACtB,mBAAmB,GACpB,MAAM,qBAAqB,CAAA;AAC5B,OAAO,EACL,uBAAuB,EACvB,KAAK,yBAAyB,EAC9B,qBAAqB,EACrB,KAAK,0BAA0B,GAChC,MAAM,eAAe,CAAA"}

package/dist/checkout.js

@@ -0,0 +1,3 @@
+export * from "./checkout-hooks/index.js";
+export * from "./checkout-i18n/index.js";
+export { useVoyantFinanceContext, VoyantFinanceProvider, } from "./provider.js";

package/dist/client.d.ts

@@ -0,0 +1,16 @@
+import type { z } from "zod";
+export type VoyantFetcher = (url: string, init?: RequestInit) => Promise<Response>;
+export declare const defaultFetcher: VoyantFetcher;
+export declare class VoyantApiError extends Error {
+    readonly status: number;
+    readonly body: unknown;
+    constructor(message: string, status: number, body: unknown);
+}
+export interface FetchWithValidationOptions {
+    baseUrl: string;
+    fetcher: VoyantFetcher;
+}
+export type QueryParamValue = string | number | boolean | null | undefined | Array<string | number | boolean>;
+export declare function fetchWithValidation<TOut>(path: string, schema: z.ZodType<TOut>, options: FetchWithValidationOptions, init?: RequestInit): Promise<TOut>;
+export declare function withQueryParams(path: string, query?: object): string;
+//# sourceMappingURL=client.d.ts.map

package/dist/client.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../src/client.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,CAAC,EAAE,MAAM,KAAK,CAAA;AAE5B,MAAM,MAAM,aAAa,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,WAAW,KAAK,OAAO,CAAC,QAAQ,CAAC,CAAA;AAElF,eAAO,MAAM,cAAc,EAAE,aACoB,CAAA;AAEjD,qBAAa,cAAe,SAAQ,KAAK;IACvC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAA;gBAEV,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO;CAM3D;AAaD,MAAM,WAAW,0BAA0B;IACzC,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,aAAa,CAAA;CACvB;AAED,MAAM,MAAM,eAAe,GACvB,MAAM,GACN,MAAM,GACN,OAAO,GACP,IAAI,GACJ,SAAS,GACT,KAAK,CAAC,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAA;AAEpC,wBAAsB,mBAAmB,CAAC,IAAI,EAC5C,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,EACvB,OAAO,EAAE,0BAA0B,EACnC,IAAI,CAAC,EAAE,WAAW,GACjB,OAAO,CAAC,IAAI,CAAC,CAgCf;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAwBpE"}

package/dist/client.js

@@ -0,0 +1,79 @@
+export const defaultFetcher = (url, init) => fetch(url, { credentials: "include", ...init });
+export class VoyantApiError extends Error {
+    status;
+    body;
+    constructor(message, status, body) {
+        super(message);
+        this.name = "VoyantApiError";
+        this.status = status;
+        this.body = body;
+    }
+}
+function extractErrorMessage(status, statusText, body) {
+    if (typeof body === "object" && body !== null && "error" in body) {
+        const err = body.error;
+        if (typeof err === "string")
+            return err;
+        if (typeof err === "object" && err !== null && "message" in err) {
+            return String(err.message);
+        }
+    }
+    return `Voyant API error: ${status} ${statusText}`;
+}
+export async function fetchWithValidation(path, schema, options, init) {
+    const url = joinUrl(options.baseUrl, path);
+    const headers = new Headers(init?.headers);
+    if (init?.body !== undefined && !headers.has("Content-Type")) {
+        headers.set("Content-Type", "application/json");
+    }
+    const response = await options.fetcher(url, { ...init, headers });
+    if (!response.ok) {
+        const body = await safeJson(response);
+        throw new VoyantApiError(extractErrorMessage(response.status, response.statusText, body), response.status, body);
+    }
+    if (response.status === 204) {
+        return schema.parse(undefined);
+    }
+    const body = await safeJson(response);
+    const parsed = schema.safeParse(body);
+    if (!parsed.success) {
+        throw new VoyantApiError(`Voyant API response failed validation: ${parsed.error.message}`, response.status, body);
+    }
+    return parsed.data;
+}
+export function withQueryParams(path, query) {
+    if (!query) {
+        return path;
+    }
+    const params = new URLSearchParams();
+    for (const [key, value] of Object.entries(query)) {
+        if (value === undefined || value === null) {
+            continue;
+        }
+        if (Array.isArray(value)) {
+            for (const item of value) {
+                params.append(key, String(item));
+            }
+            continue;
+        }
+        params.set(key, String(value));
+    }
+    const serialized = params.toString();
+    return serialized ? `${path}?${serialized}` : path;
+}
+async function safeJson(response) {
+    const text = await response.text();
+    if (!text)
+        return undefined;
+    try {
+        return JSON.parse(text);
+    }
+    catch {
+        return text;
+    }
+}
+function joinUrl(baseUrl, path) {
+    const trimmedBase = baseUrl.endsWith("/") ? baseUrl.slice(0, -1) : baseUrl;
+    const trimmedPath = path.startsWith("/") ? path : `/${path}`;
+    return `${trimmedBase}${trimmedPath}`;
+}

package/dist/components/accountant-portal/body.d.ts

@@ -0,0 +1,8 @@
+import type { FinanceUiMessages } from "../../i18n/index.js";
+import type { AccountantPortalProps } from "../accountant-portal.js";
+export declare function AccountantPortalBody({ token, apiBaseUrl, className, messages, locale, onLocaleChange, }: Omit<AccountantPortalProps, "defaultLocale"> & {
+    messages: FinanceUiMessages;
+    locale: string;
+    onLocaleChange: (locale: string) => void;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=body.d.ts.map

package/dist/components/accountant-portal/body.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"body.d.ts","sourceRoot":"","sources":["../../../src/components/accountant-portal/body.tsx"],"names":[],"mappings":"AAuCA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AAO5D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAYpE,wBAAgB,oBAAoB,CAAC,EACnC,KAAK,EACL,UAAU,EACV,SAAS,EACT,QAAQ,EACR,MAAM,EACN,cAAc,GACf,EAAE,IAAI,CAAC,qBAAqB,EAAE,eAAe,CAAC,GAAG;IAChD,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,MAAM,EAAE,MAAM,CAAA;IACd,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;CACzC,2CAkgBA"}

package/dist/components/accountant-portal/body.js

@@ -0,0 +1,114 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useQuery } from "@tanstack/react-query";
+import { formatMessage } from "@voyant-travel/i18n";
+import { Badge, Button, Card, CardContent, CardHeader, CardTitle, Checkbox, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from "@voyant-travel/ui/components";
+import { ChartContainer, ChartLegend, ChartLegendContent, ChartTooltip, ChartTooltipContent, } from "@voyant-travel/ui/components/chart";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "@voyant-travel/ui/components/table";
+import { cn } from "@voyant-travel/ui/lib/utils";
+import { Download, Globe } from "lucide-react";
+import { useMemo, useState } from "react";
+import { Bar, BarChart, CartesianGrid, Cell, Pie, PieChart, XAxis, YAxis } from "recharts";
+import { financeUiMessageDefinitions } from "../../i18n/index.js";
+import { defaultFetcher, getAccountantInvoicesQueryOptions, getAccountantSummaryQueryOptions, } from "../../index.js";
+import { AsyncCombobox, localOptionSearch } from "../async-combobox.js";
+import { formatInvoiceAmount } from "../invoice-table-parts.js";
+import { Kpi, serviceTypeChart } from "./widgets.js";
+const CHART_DEPARTURE_LIMIT = 12;
+const marginText = (value) => (value == null ? "—" : `${value.toFixed(1)}%`);
+const LOCALES = Object.keys(financeUiMessageDefinitions);
+const LOCALE_NAMES = { en: "English", ro: "Română" };
+export function AccountantPortalBody({ token, apiBaseUrl, className, messages, locale, onLocaleChange, }) {
+    const t = messages.profitability;
+    const client = useMemo(() => ({ baseUrl: apiBaseUrl, fetcher: defaultFetcher }), [apiBaseUrl]);
+    const [currency, setCurrency] = useState("");
+    // Consolidated view = the operator accounting-base rollup (snapshotted FX).
+    // The base currency is fixed by the operator — no viewer-chosen base.
+    const [consolidate, setConsolidate] = useState(true);
+    const [productId, setProductId] = useState("");
+    const [departureId, setDepartureId] = useState("");
+    const summary = useQuery(getAccountantSummaryQueryOptions(client, token));
+    const invoices = useQuery(getAccountantInvoicesQueryOptions(client, token));
+    const data = summary.data?.data;
+    const departures = data?.departures;
+    const products = data?.products;
+    const baseCurrencyCode = departures?.base?.currency ?? products?.base?.currency ?? "";
+    const baseMode = consolidate && Boolean(departures?.base);
+    const currencies = useMemo(() => {
+        const set = new Set();
+        for (const row of departures?.rows ?? [])
+            set.add(row.currency);
+        for (const row of products?.rows ?? [])
+            set.add(row.currency);
+        return [...set].sort();
+    }, [departures, products]);
+    const activeCurrency = baseMode
+        ? (departures?.base?.currency ?? "")
+        : currency && currencies.includes(currency)
+            ? currency
+            : (currencies[0] ?? "");
+    const currencyDepartureRows = baseMode
+        ? (departures?.base?.rows ?? [])
+        : (departures?.rows ?? []).filter((r) => r.currency === activeCurrency);
+    const currencyProductRows = baseMode
+        ? (products?.base?.rows ?? [])
+        : (products?.rows ?? []).filter((r) => r.currency === activeCurrency);
+    // Product/departure filters (client-side over the loaded scope).
+    const productOptions = useMemo(() => {
+        const map = new Map();
+        for (const r of currencyDepartureRows) {
+            if (r.productId)
+                map.set(r.productId, r.productName ?? r.productId);
+        }
+        return [...map.entries()]
+            .map(([id, name]) => ({ id, name }))
+            .sort((a, b) => a.name.localeCompare(b.name));
+    }, [currencyDepartureRows]);
+    const departureOptions = useMemo(() => currencyDepartureRows
+        .filter((r) => !productId || r.productId === productId)
+        .map((r) => ({ id: r.departureId, label: r.departureLabel ?? r.departureId })), [currencyDepartureRows, productId]);
+    const departureRows = currencyDepartureRows.filter((r) => (!productId || r.productId === productId) && (!departureId || r.departureId === departureId));
+    const productRows = currencyProductRows.filter((r) => !productId || r.productId === productId);
+    const totals = useMemo(() => {
+        let revenue = 0;
+        let actual = 0;
+        for (const r of departureRows) {
+            revenue += r.revenueCents;
+            actual += r.actualCostCents;
+        }
+        const profit = revenue - actual;
+        return { revenue, actual, profit, margin: revenue > 0 ? (profit / revenue) * 100 : null };
+    }, [departureRows]);
+    const serviceTypeData = serviceTypeChart(departures, baseMode, activeCurrency, t.serviceTypeLabels);
+    const chartData = [...departureRows]
+        .sort((a, b) => b.revenueCents - a.revenueCents)
+        .slice(0, CHART_DEPARTURE_LIMIT)
+        .map((r) => ({
+        name: r.departureLabel ?? r.departureId,
+        revenue: r.revenueCents / 100,
+        actualCost: r.actualCostCents / 100,
+        profit: r.profitCents / 100,
+    }));
+    const barConfig = {
+        revenue: { label: t.charts.revenue, color: "hsl(221 83% 53%)" }, // i18n-literal-ok (chart color)
+        actualCost: { label: t.charts.actualCost, color: "hsl(0 72% 51%)" }, // i18n-literal-ok (chart color)
+        profit: { label: t.charts.profit, color: "hsl(142 71% 45%)" }, // i18n-literal-ok (chart color)
+    };
+    const pieConfig = Object.fromEntries(serviceTypeData.map((d) => [d.serviceType, { label: d.label, color: d.fill }]));
+    const money = (cents) => formatInvoiceAmount(cents, activeCurrency);
+    const periodLabel = data?.scope.from || data?.scope.to
+        ? `${data?.scope.from ?? "…"} – ${data?.scope.to ?? "…"}`
+        : t.portal.allTime;
+    const exportUrl = (report) => `${apiBaseUrl}/v1/public/finance/accountant/${encodeURIComponent(token)}/export/${report}`;
+    const downloadUrl = (kind, invoiceId, attachmentId) => `${apiBaseUrl}/v1/public/finance/accountant/${encodeURIComponent(token)}/invoices/${invoiceId}/attachments/${attachmentId}/download?kind=${kind}`;
+    if (summary.isError) {
+        return (_jsx("div", { className: cn("mx-auto max-w-2xl p-6", className), children: _jsx(Card, { children: _jsx(CardContent, { className: "py-12 text-center text-muted-foreground", children: t.portal.gone }) }) }));
+    }
+    const invoiceRows = invoices.data?.data ?? [];
+    return (_jsxs("div", { className: cn("mx-auto flex max-w-6xl flex-col gap-6 p-6", className), children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-3", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-bold tracking-tight", children: t.portal.title }), _jsxs("p", { className: "text-sm text-muted-foreground", children: [periodLabel, " \u00B7 ", t.portal.subtitle] })] }), _jsxs("div", { className: "flex flex-wrap items-end gap-3", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs(Label, { className: "flex items-center gap-1.5", children: [_jsx(Globe, { className: "size-3.5" }), t.portal.language] }), _jsxs(Select, { value: locale, onValueChange: (v) => onLocaleChange(v ?? "en"), children: [_jsx(SelectTrigger, { className: "w-36", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: LOCALES.map((code) => (_jsx(SelectItem, { value: code, children: LOCALE_NAMES[code] ?? code.toUpperCase() }, code))) })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.filters.product }), _jsx(AsyncCombobox, { className: "w-56", placeholder: t.filters.allProducts, value: productId || null, onChange: (v) => {
+                                            setProductId(v ?? "");
+                                            setDepartureId("");
+                                        }, search: localOptionSearch(productOptions.map((p) => ({ value: p.id, label: p.name }))) })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.filters.departure }), _jsx(AsyncCombobox, { className: "w-56", placeholder: t.filters.allDepartures, value: departureId || null, onChange: (v) => setDepartureId(v ?? ""), search: localOptionSearch(departureOptions.map((d) => ({ value: d.id, label: d.label }))) })] }), !baseMode && currencies.length > 1 ? (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.filters.currency }), _jsxs(Select, { value: activeCurrency, onValueChange: (v) => setCurrency(v ?? ""), children: [_jsx(SelectTrigger, { className: "w-32", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: currencies.map((c) => (_jsx(SelectItem, { value: c, children: c }, c))) })] })] })) : null, _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { htmlFor: "accountant-consolidate", children: t.filters.baseCurrency }), _jsxs("div", { className: "flex h-9 items-center gap-2", children: [_jsx(Checkbox, { id: "accountant-consolidate", checked: consolidate, onCheckedChange: (v) => setConsolidate(v === true) }), _jsx(Label, { htmlFor: "accountant-consolidate", className: "font-normal", children: baseCurrencyCode || t.filters.baseCurrency })] })] })] })] }), baseMode && (departures?.base?.unconvertibleCurrencies.length ?? 0) > 0 ? (_jsx("p", { className: "text-sm text-amber-600 dark:text-amber-500", children: formatMessage(t.unconvertibleNote, {
+                    currencies: (departures?.base?.unconvertibleCurrencies ?? []).join(", "),
+                }) })) : null, _jsxs("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: [_jsx(Kpi, { label: t.kpis.revenue, value: money(totals.revenue) }), _jsx(Kpi, { label: t.kpis.actualCost, value: money(totals.actual) }), _jsx(Kpi, { label: t.kpis.profit, value: money(totals.profit), accent: totals.profit >= 0 ? "positive" : "negative" }), _jsx(Kpi, { label: t.kpis.margin, value: marginText(totals.margin) })] }), _jsxs("div", { className: "grid gap-4 lg:grid-cols-2", children: [_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: t.charts.departurePnl }) }), _jsx(CardContent, { children: chartData.length ? (_jsx(ChartContainer, { config: barConfig, className: "h-[300px] w-full", children: _jsxs(BarChart, { data: chartData, margin: { top: 10, right: 10, left: 0, bottom: 0 }, children: [_jsx(CartesianGrid, { vertical: false }), _jsx(XAxis, { dataKey: "name", tickLine: false, axisLine: false, tickMargin: 8, tickFormatter: (v) => (v.length > 14 ? `${v.slice(0, 13)}…` : v) }), _jsx(YAxis, { tickLine: false, axisLine: false, tickMargin: 8, width: 56 }), _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, {}) }), _jsx(ChartLegend, { content: _jsx(ChartLegendContent, {}) }), _jsx(Bar, { dataKey: "revenue", fill: "var(--color-revenue)", radius: 2 }), _jsx(Bar, { dataKey: "actualCost", fill: "var(--color-actualCost)", radius: 2 }), _jsx(Bar, { dataKey: "profit", fill: "var(--color-profit)", radius: 2 })] }) })) : (_jsx("p", { className: "py-10 text-center text-sm text-muted-foreground", children: t.departures.none })) })] }), _jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: t.charts.costByServiceType }) }), _jsx(CardContent, { children: serviceTypeData.length ? (_jsx(ChartContainer, { config: pieConfig, className: "mx-auto h-[300px] w-full", children: _jsxs(PieChart, { children: [_jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, { nameKey: "label", hideLabel: true }) }), _jsx(Pie, { data: serviceTypeData, dataKey: "amount", nameKey: "label", cx: "50%", cy: "50%", innerRadius: 60, outerRadius: 100, paddingAngle: 2, children: serviceTypeData.map((entry) => (_jsx(Cell, { fill: entry.fill }, entry.serviceType))) }), _jsx(ChartLegend, { content: _jsx(ChartLegendContent, { nameKey: "label" }) })] }) })) : (_jsx("p", { className: "py-10 text-center text-sm text-muted-foreground", children: t.empty })) })] })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between", children: [_jsx(CardTitle, { className: "text-base", children: t.departures.title }), _jsx("a", { href: exportUrl("departures"), target: "_blank", rel: "noopener noreferrer", children: _jsxs(Button, { variant: "outline", size: "sm", children: [_jsx(Download, { className: "size-4" }), t.exportCsv] }) })] }), _jsx(CardContent, { className: "overflow-x-auto", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: t.departures.columns.departure }), _jsx(TableHead, { children: t.departures.columns.date }), _jsx(TableHead, { className: "text-right", children: t.departures.columns.revenue }), _jsx(TableHead, { className: "text-right", children: t.departures.columns.actualCost }), _jsx(TableHead, { className: "text-right", children: t.departures.columns.profit }), _jsx(TableHead, { className: "text-right", children: t.departures.columns.margin })] }) }), _jsx(TableBody, { children: departureRows.length === 0 ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 6, className: "text-center text-muted-foreground", children: t.departures.none }) })) : (departureRows.map((row) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-medium", children: row.departureLabel ?? row.departureId }), _jsx(TableCell, { className: "text-muted-foreground", children: row.departureDate ?? t.noDate }), _jsx(TableCell, { className: "text-right tabular-nums", children: money(row.revenueCents) }), _jsx(TableCell, { className: "text-right tabular-nums", children: money(row.actualCostCents) }), _jsx(TableCell, { className: cn("text-right tabular-nums", row.profitCents < 0 && "text-destructive"), children: money(row.profitCents) }), _jsx(TableCell, { className: "text-right tabular-nums", children: marginText(row.marginPercent) })] }, `${row.departureId}:${row.currency}`)))) })] }) })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between", children: [_jsx(CardTitle, { className: "text-base", children: t.products.title }), _jsx("a", { href: exportUrl("products"), target: "_blank", rel: "noopener noreferrer", children: _jsxs(Button, { variant: "outline", size: "sm", children: [_jsx(Download, { className: "size-4" }), t.exportCsv] }) })] }), _jsx(CardContent, { className: "overflow-x-auto", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: t.products.columns.product }), _jsx(TableHead, { className: "text-right", children: t.products.columns.departures }), _jsx(TableHead, { className: "text-right", children: t.products.columns.revenue }), _jsx(TableHead, { className: "text-right", children: t.products.columns.actualCost }), _jsx(TableHead, { className: "text-right", children: t.products.columns.profit }), _jsx(TableHead, { className: "text-right", children: t.products.columns.margin })] }) }), _jsx(TableBody, { children: productRows.length === 0 ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 6, className: "text-center text-muted-foreground", children: t.products.none }) })) : (productRows.map((row) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-medium", children: row.productName ?? row.productId }), _jsx(TableCell, { className: "text-right tabular-nums", children: row.departureCount }), _jsx(TableCell, { className: "text-right tabular-nums", children: money(row.revenueCents) }), _jsx(TableCell, { className: "text-right tabular-nums", children: money(row.actualCostCents) }), _jsx(TableCell, { className: cn("text-right tabular-nums", row.profitCents < 0 && "text-destructive"), children: money(row.profitCents) }), _jsx(TableCell, { className: "text-right tabular-nums", children: marginText(row.marginPercent) })] }, `${row.productId}:${row.currency}`)))) })] }) })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between", children: [_jsx(CardTitle, { className: "text-base", children: t.portal.invoices }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("a", { href: `${apiBaseUrl}/v1/public/finance/accountant/${encodeURIComponent(token)}/invoices/download-all`, target: "_blank", rel: "noopener noreferrer", children: _jsxs(Button, { variant: "outline", size: "sm", children: [_jsx(Download, { className: "size-4" }), t.portal.downloadAll] }) }), _jsx("a", { href: exportUrl("invoices"), target: "_blank", rel: "noopener noreferrer", children: _jsxs(Button, { variant: "outline", size: "sm", children: [_jsx(Download, { className: "size-4" }), t.exportCsv] }) })] })] }), _jsx(CardContent, { className: "overflow-x-auto", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: t.portal.columns.type }), _jsx(TableHead, { children: t.portal.columns.invoice }), _jsx(TableHead, { children: t.portal.columns.status }), _jsx(TableHead, { children: t.portal.columns.issueDate }), _jsx(TableHead, { className: "text-right", children: t.portal.columns.total }), _jsx(TableHead, { className: "text-right", children: t.portal.columns.balanceDue }), _jsx(TableHead, { children: t.portal.columns.attachments })] }) }), _jsx(TableBody, { children: invoiceRows.length === 0 ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 7, className: "text-center text-muted-foreground", children: t.portal.invoicesNone }) })) : (invoiceRows.map((inv) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx(Badge, { variant: inv.kind === "supplier" ? "secondary" : "outline", children: inv.kind === "supplier" ? t.portal.kindSupplier : t.portal.kindClient }) }), _jsx(TableCell, { className: "font-medium", children: inv.invoiceNumber }), _jsx(TableCell, { children: _jsx(Badge, { variant: "outline", children: inv.status }) }), _jsx(TableCell, { className: "text-muted-foreground", children: inv.issueDate }), _jsx(TableCell, { className: "text-right tabular-nums", children: formatInvoiceAmount(inv.totalCents, inv.currency) }), _jsx(TableCell, { className: "text-right tabular-nums", children: formatInvoiceAmount(inv.balanceDueCents, inv.currency) }), _jsx(TableCell, { children: inv.attachments.length === 0 ? (_jsx("span", { className: "text-muted-foreground", children: t.portal.noFile })) : (_jsx("div", { className: "flex flex-wrap gap-2", children: inv.attachments.map((att) => att.hasFile ? (_jsxs("a", { href: downloadUrl(inv.kind, inv.id, att.id), target: "_blank", rel: "noopener noreferrer", className: "inline-flex items-center gap-1 text-sm text-primary underline-offset-2 hover:underline", children: [_jsx(Download, { className: "size-3.5" }), att.name] }, att.id)) : (_jsx("span", { className: "text-sm text-muted-foreground", children: att.name }, att.id))) })) })] }, `${inv.kind}:${inv.id}`)))) })] }) })] })] }));
+}

package/dist/components/accountant-portal/widgets.d.ts

@@ -0,0 +1,13 @@
+import type { DepartureProfitabilityReport } from "../../index.js";
+export declare function serviceTypeChart(departures: DepartureProfitabilityReport | undefined, baseMode: boolean, activeCurrency: string, labels: Record<string, string>): {
+    serviceType: string;
+    label: string;
+    amount: number;
+    fill: string | undefined;
+}[];
+export declare function Kpi({ label, value, accent, }: {
+    label: string;
+    value: string;
+    accent?: "positive" | "negative";
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=widgets.d.ts.map

package/dist/components/accountant-portal/widgets.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"widgets.d.ts","sourceRoot":"","sources":["../../../src/components/accountant-portal/widgets.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,gBAAgB,CAAA;AAalE,wBAAgB,gBAAgB,CAC9B,UAAU,EAAE,4BAA4B,GAAG,SAAS,EACpD,QAAQ,EAAE,OAAO,EACjB,cAAc,EAAE,MAAM,EACtB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;;;;;IAW/B;AAED,wBAAgB,GAAG,CAAC,EAClB,KAAK,EACL,KAAK,EACL,MAAM,GACP,EAAE;IACD,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,UAAU,GAAG,UAAU,CAAA;CACjC,2CAiBA"}

package/dist/components/accountant-portal/widgets.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Card, CardDescription, CardHeader, CardTitle } from "@voyant-travel/ui/components";
+import { cn } from "@voyant-travel/ui/lib/utils";
+const PIE_COLORS = [
+    "hsl(221 83% 53%)",
+    "hsl(142 71% 45%)",
+    "hsl(38 92% 50%)",
+    "hsl(0 72% 51%)",
+    "hsl(199 89% 48%)",
+    "hsl(280 65% 60%)",
+    "hsl(160 60% 45%)",
+    "hsl(28 80% 52%)",
+];
+export function serviceTypeChart(departures, baseMode, activeCurrency, labels) {
+    const source = baseMode
+        ? (departures?.base?.costByServiceType ?? [])
+        : (departures?.costByServiceType ?? []).filter((c) => c.currency === activeCurrency);
+    return source.map((c, index) => ({
+        serviceType: c.serviceType,
+        label: labels[c.serviceType] ?? c.serviceType,
+        amount: c.amountCents / 100,
+        fill: PIE_COLORS[index % PIE_COLORS.length],
+    }));
+}
+export function Kpi({ label, value, accent, }) {
+    return (_jsx(Card, { children: _jsxs(CardHeader, { className: "pb-2", children: [_jsx(CardDescription, { children: label }), _jsx(CardTitle, { className: cn("text-2xl tabular-nums", accent === "positive" && "text-emerald-600 dark:text-emerald-500", accent === "negative" && "text-destructive"), children: value })] }) }));
+}

package/dist/components/accountant-portal.d.ts

@@ -0,0 +1,10 @@
+export interface AccountantPortalProps {
+    token: string;
+    /** Absolute API origin used for the public portal endpoints + download links. */
+    apiBaseUrl: string;
+    className?: string;
+    /** Initial language (operator's configured locale); the accountant can switch. */
+    defaultLocale?: string;
+}
+export declare function AccountantPortal({ defaultLocale, ...props }: AccountantPortalProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=accountant-portal.d.ts.map

package/dist/components/accountant-portal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accountant-portal.d.ts","sourceRoot":"","sources":["../../src/components/accountant-portal.tsx"],"names":[],"mappings":"AAqBA,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAA;IACb,iFAAiF;IACjF,UAAU,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kFAAkF;IAClF,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB;AAED,wBAAgB,gBAAgB,CAAC,EAAE,aAAa,EAAE,GAAG,KAAK,EAAE,EAAE,qBAAqB,2CAelF"}

package/dist/components/accountant-portal.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { FinanceUiMessagesProvider, financeUiMessageDefinitions, getFinanceUiI18n, } from "../i18n/index.js";
+import { AccountantPortalBody } from "./accountant-portal/body.js";
+const LOCALES = Object.keys(financeUiMessageDefinitions);
+function initialLocale(defaultLocale) {
+    const candidates = [defaultLocale, typeof navigator !== "undefined" ? navigator.language : null];
+    for (const c of candidates) {
+        const code = c?.toLowerCase().split("-")[0];
+        if (code && LOCALES.includes(code))
+            return code;
+    }
+    return "en";
+}
+export function AccountantPortal({ defaultLocale, ...props }) {
+    const [locale, setLocale] = useState(() => initialLocale(defaultLocale));
+    // Resolve messages directly from the chosen locale and pass them down, so the
+    // portal localizes regardless of any ambient FinanceUiMessagesProvider locale.
+    const messages = useMemo(() => getFinanceUiI18n({ locale }).messages, [locale]);
+    return (_jsx(FinanceUiMessagesProvider, { locale: locale, children: _jsx(AccountantPortalBody, { ...props, messages: messages, locale: locale, onLocaleChange: setLocale }) }));
+}

package/dist/components/accountant-share-dialog.d.ts

@@ -0,0 +1,6 @@
+export interface AccountantShareDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+}
+export declare function AccountantShareDialog({ open, onOpenChange }: AccountantShareDialogProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=accountant-share-dialog.d.ts.map

package/dist/components/accountant-share-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accountant-share-dialog.d.ts","sourceRoot":"","sources":["../../src/components/accountant-share-dialog.tsx"],"names":[],"mappings":"AAoBA,MAAM,WAAW,0BAA0B;IACzC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;CACtC;AAED,wBAAgB,qBAAqB,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,0BAA0B,2CA4IvF"}

package/dist/components/accountant-share-dialog.js

@@ -0,0 +1,53 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { formatMessage } from "@voyant-travel/i18n";
+import { Button, Dialog, DialogBody, DialogContent, DialogHeader, DialogTitle, Input, Label, } from "@voyant-travel/ui/components";
+import { CurrencyCombobox } from "@voyant-travel/ui/components/currency-combobox";
+import { DatePicker } from "@voyant-travel/ui/components/date-picker";
+import { Check, Copy, Plus, Trash2 } from "lucide-react";
+import { useState } from "react";
+import { useFinanceUiMessagesOrDefault } from "../i18n/index.js";
+import { useAccountantShareMutation, useAccountantShares } from "../index.js";
+export function AccountantShareDialog({ open, onOpenChange }) {
+    const t = useFinanceUiMessagesOrDefault().profitability.share;
+    const shares = useAccountantShares();
+    const { create, revoke } = useAccountantShareMutation();
+    const [from, setFrom] = useState("");
+    const [to, setTo] = useState("");
+    const [baseCurrency, setBaseCurrency] = useState("");
+    const [ttlDays, setTtlDays] = useState("30");
+    // The token is only known at creation (only its hash is stored), so the link
+    // is shown once here; the list below can't reconstruct it.
+    const [created, setCreated] = useState(null);
+    const [copied, setCopied] = useState(false);
+    const submit = () => {
+        create.mutate({
+            from: from || undefined,
+            to: to || undefined,
+            baseCurrency: baseCurrency || undefined,
+            ttlDays: ttlDays ? Number(ttlDays) : undefined,
+        }, {
+            onSuccess: (share) => {
+                if (!share?.url)
+                    return;
+                setCreated({ url: share.url });
+                setCopied(false);
+                if (navigator.clipboard) {
+                    void navigator.clipboard.writeText(share.url).then(() => setCopied(true));
+                }
+            },
+        });
+    };
+    const copyCreated = () => {
+        if (!created || !navigator.clipboard)
+            return;
+        void navigator.clipboard.writeText(created.url).then(() => setCopied(true));
+    };
+    const rows = shares.data?.data ?? [];
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-lg", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: t.title }) }), _jsxs(DialogBody, { className: "flex flex-col gap-5", children: [_jsx("p", { className: "text-sm text-muted-foreground", children: t.description }), _jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.from }), _jsx(DatePicker, { value: from || null, onChange: (v) => setFrom(v ?? ""), className: "w-full" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.to }), _jsx(DatePicker, { value: to || null, onChange: (v) => setTo(v ?? ""), className: "w-full" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.baseCurrency }), _jsx(CurrencyCombobox, { value: baseCurrency || null, onChange: (v) => setBaseCurrency(v ?? ""), className: "w-full" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.ttlDays }), _jsx(Input, { inputMode: "numeric", value: ttlDays, onChange: (e) => setTtlDays(e.target.value.replace(/[^0-9]/g, "")) })] })] }), _jsxs(Button, { type: "button", onClick: submit, disabled: create.isPending, className: "self-start", children: [_jsx(Plus, { className: "size-4" }), create.isPending ? t.creating : t.create] }), created ? (_jsxs("div", { className: "flex items-center gap-2 rounded-md border bg-muted/40 p-2", children: [_jsx("code", { className: "min-w-0 flex-1 truncate text-xs", children: created.url }), _jsxs(Button, { variant: "outline", size: "sm", onClick: copyCreated, children: [copied ? _jsx(Check, { className: "size-4" }) : _jsx(Copy, { className: "size-4" }), copied ? t.copied : t.copy] })] })) : null, _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("span", { className: "text-sm font-medium", children: t.active }), rows.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: t.none })) : (_jsx("ul", { className: "flex flex-col divide-y rounded-md border", children: rows.map((share) => {
+                                        const period = share.from || share.to ? `${share.from ?? "…"} – ${share.to ?? "…"}` : t.allTime;
+                                        return (_jsxs("li", { className: "flex items-center justify-between gap-2 p-2 text-sm", children: [_jsxs("div", { className: "min-w-0", children: [_jsxs("div", { className: "font-medium", children: [period, share.baseCurrency ? ` · ${share.baseCurrency}` : ""] }), _jsxs("div", { className: "text-xs text-muted-foreground", children: [formatMessage(t.expires, { date: share.expiresAt.slice(0, 10) }), " \u00B7", " ", share.accessCount > 0
+                                                                    ? formatMessage(t.opened, { count: share.accessCount })
+                                                                    : t.neverOpened] })] }), _jsx(Button, { variant: "ghost", size: "icon-sm", onClick: () => revoke.mutate(share.id), disabled: revoke.isPending, children: _jsx(Trash2, { className: "size-4 text-destructive" }) })] }, share.id));
+                                    }) }))] })] })] }) }));
+}

package/dist/components/async-combobox.d.ts

@@ -0,0 +1,33 @@
+export interface AsyncComboboxOption {
+    value: string;
+    label: string;
+}
+/** Client-side typeahead over already-loaded options (no server round-trip). */
+export declare const localOptionSearch: (options: AsyncComboboxOption[]) => (query: string) => Promise<AsyncComboboxOption[]>;
+export interface AsyncComboboxProps {
+    value: string | null | undefined;
+    onChange: (value: string | null) => void;
+    /** Resolve options for a query (debounced). */
+    search: (query: string) => Promise<AsyncComboboxOption[]>;
+    /**
+     * When set, an inline "create" row appears for the current query (unless it
+     * exactly matches an existing option). Returns the new option to select, or
+     * null to cancel.
+     */
+    onCreate?: (query: string) => Promise<AsyncComboboxOption | null>;
+    /** Label for the inline create row; receives the trimmed query. */
+    createLabel?: (query: string) => string;
+    placeholder?: string;
+    emptyText?: string;
+    disabled?: boolean;
+    className?: string;
+}
+/**
+ * A generic search-as-you-type combobox backed by an async resolver. Keeps a
+ * label cache so a previously-selected value still renders a friendly label
+ * (falls back to the raw value when unknown). Used for picking departures /
+ * products / bookings by search rather than typing a raw id.
+ */
+export declare function AsyncCombobox({ value, onChange, search, onCreate, createLabel, placeholder, // i18n-literal-ok (generic fallback; callers pass localized copy)
+emptyText, disabled, className, }: AsyncComboboxProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=async-combobox.d.ts.map

package/dist/components/async-combobox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"async-combobox.d.ts","sourceRoot":"","sources":["../../src/components/async-combobox.tsx"],"names":[],"mappings":"AAcA,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;CACd;AAED,gFAAgF;AAChF,eAAO,MAAM,iBAAiB,GAC3B,SAAS,mBAAmB,EAAE,MAC9B,OAAO,MAAM,KAAG,OAAO,CAAC,mBAAmB,EAAE,CAG7C,CAAA;AAEH,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAA;IAChC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IACxC,+CAA+C;IAC/C,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,mBAAmB,EAAE,CAAC,CAAA;IACzD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAA;IACjE,mEAAmE;IACnE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IACvC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAID;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,WAAW,EACX,WAAuB,EAAE,kEAAkE;AAC3F,SAAyB,EACzB,QAAQ,EACR,SAAS,GACV,EAAE,kBAAkB,2CAyHpB"}

package/dist/components/async-combobox.js

@@ -0,0 +1,100 @@
+"use client";
+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 { Plus } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
+/** Client-side typeahead over already-loaded options (no server round-trip). */
+export const localOptionSearch = (options) => (query) => {
+    const q = query.trim().toLowerCase();
+    return Promise.resolve(q ? options.filter((o) => o.label.toLowerCase().includes(q)) : options);
+};
+const CREATE_SENTINEL = "__async_combobox_create__";
+/**
+ * A generic search-as-you-type combobox backed by an async resolver. Keeps a
+ * label cache so a previously-selected value still renders a friendly label
+ * (falls back to the raw value when unknown). Used for picking departures /
+ * products / bookings by search rather than typing a raw id.
+ */
+export function AsyncCombobox({ value, onChange, search, onCreate, createLabel, placeholder = "Search…", // i18n-literal-ok (generic fallback; callers pass localized copy)
+emptyText = "No results.", disabled, className, }) {
+    const [query, setQuery] = useState("");
+    const [options, setOptions] = useState([]);
+    const [labels, setLabels] = useState({});
+    const [inputValue, setInputValue] = useState("");
+    const [creating, setCreating] = useState(false);
+    const onCreateRef = useRef(onCreate);
+    onCreateRef.current = onCreate;
+    // Latest search fn via ref so the debounce effect only re-runs on query.
+    const searchRef = useRef(search);
+    searchRef.current = search;
+    useEffect(() => {
+        let active = true;
+        const handle = setTimeout(() => {
+            searchRef
+                .current(query)
+                .then((results) => {
+                if (!active)
+                    return;
+                setOptions(results);
+                setLabels((prev) => {
+                    const next = { ...prev };
+                    for (const o of results)
+                        next[o.value] = o.label;
+                    return next;
+                });
+            })
+                .catch(() => {
+                if (active)
+                    setOptions([]);
+            });
+        }, 200);
+        return () => {
+            active = false;
+            clearTimeout(handle);
+        };
+    }, [query]);
+    // Reflect the selected value's label (or raw id) in the input.
+    useEffect(() => {
+        setInputValue(value ? (labels[value] ?? value) : "");
+    }, [value, labels]);
+    const trimmed = query.trim();
+    const hasExactMatch = options.some((o) => o.label.toLowerCase() === trimmed.toLowerCase());
+    const showCreate = Boolean(onCreate) && trimmed.length > 0 && !hasExactMatch && !creating;
+    const createRowLabel = (createLabel ?? ((q) => `Create "${q}"`))(trimmed);
+    const items = showCreate
+        ? [...options.map((o) => o.value), CREATE_SENTINEL]
+        : options.map((o) => o.value);
+    const create = () => {
+        const fn = onCreateRef.current;
+        if (!fn)
+            return;
+        const name = query.trim();
+        if (!name)
+            return;
+        setCreating(true);
+        fn(name)
+            .then((opt) => {
+            if (!opt)
+                return;
+            setLabels((prev) => ({ ...prev, [opt.value]: opt.label }));
+            onChange(opt.value);
+            setInputValue(opt.label);
+            setQuery("");
+        })
+            .finally(() => setCreating(false));
+    };
+    return (_jsxs(Combobox, { items: items, value: value ?? null, inputValue: inputValue, autoHighlight: true, disabled: disabled || creating, itemToStringValue: (v) => v === CREATE_SENTINEL ? createRowLabel : (labels[v] ?? v), onInputValueChange: (next) => {
+            setInputValue(next);
+            setQuery(next);
+            if (!next)
+                onChange(null);
+        }, onValueChange: (next) => {
+            const v = next ?? null;
+            if (v === CREATE_SENTINEL) {
+                create();
+                return;
+            }
+            onChange(v);
+            setInputValue(v ? (labels[v] ?? v) : "");
+        }, children: [_jsx(ComboboxInput, { className: className ?? "w-full", placeholder: placeholder, disabled: disabled || creating, showClear: Boolean(value) && !disabled && !creating }), _jsxs(ComboboxContent, { children: [_jsx(ComboboxEmpty, { children: emptyText }), _jsx(ComboboxList, { children: _jsx(ComboboxCollection, { children: (v) => v === CREATE_SENTINEL ? (_jsxs(ComboboxItem, { value: CREATE_SENTINEL, children: [_jsx(Plus, { className: "size-4 shrink-0" }), _jsx("span", { className: "truncate", children: createRowLabel })] }, CREATE_SENTINEL)) : (_jsx(ComboboxItem, { value: v, children: _jsx("span", { className: "truncate", children: labels[v] ?? v }) }, v)) }) })] })] }));
+}