@voyantjs/pricing-ui 0.13.0

package/README.md

@@ -0,0 +1,13 @@
+# @voyantjs/pricing-ui
+
+Importable React UI components for Voyant pricing. Bundler-consumed (Vite, Next.js, webpack, etc.).
+
+## Install
+
+```bash
+pnpm add @voyantjs/pricing-ui @voyantjs/pricing-react @voyantjs/voyant-ui @tanstack/react-query react react-dom
+```
+
+`@voyantjs/voyant-ui` provides the design-system primitives. `@voyantjs/pricing-react` provides the data-layer hooks. Both are required peers.
+
+All components accept a `className` prop and merge it with `cn()`. Wrap or compose to extend; use the registry copy-paste path (`npx shadcn add @voyant/...`) for components you want to fork outright.

package/dist/components/cancellation-policy-combobox.d.ts

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

package/dist/components/cancellation-policy-combobox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cancellation-policy-combobox.d.ts","sourceRoot":"","sources":["../../src/components/cancellation-policy-combobox.tsx"],"names":[],"mappings":"AAgBA,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAA;IAChC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IACxC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAID,wBAAgB,0BAA0B,CAAC,EACzC,KAAK,EACL,QAAQ,EACR,WAAiD,EACjD,QAAQ,GACT,EAAE,KAAK,2CA0EP"}

package/dist/components/cancellation-policy-combobox.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCancellationPolicies, useCancellationPolicy, } from "@voyantjs/pricing-react";
+import { Combobox, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxList, } from "@voyantjs/voyant-ui/components/combobox";
+import * as React from "react";
+const PAGE_SIZE = 25;
+export function CancellationPolicyCombobox({ value, onChange, placeholder = "Search cancellation fee policies…", disabled, }) {
+    const [search, setSearch] = React.useState("");
+    const listQuery = useCancellationPolicies({ search: search || undefined, limit: PAGE_SIZE });
+    const selectedQuery = useCancellationPolicy(value, { enabled: !!value });
+    const items = React.useMemo(() => {
+        const map = new Map();
+        for (const item of listQuery.data?.data ?? [])
+            map.set(item.id, item);
+        if (selectedQuery.data)
+            map.set(selectedQuery.data.id, selectedQuery.data);
+        return Array.from(map.values());
+    }, [listQuery.data?.data, selectedQuery.data]);
+    const itemMap = React.useMemo(() => new Map(items.map((item) => [item.id, item])), [items]);
+    const selected = value ? itemMap.get(value) : undefined;
+    const selectedLabel = selected
+        ? `${selected.name}${selected.code ? ` · ${selected.code}` : ""}`
+        : "";
+    const [inputValue, setInputValue] = React.useState(selectedLabel);
+    React.useEffect(() => {
+        if (selectedLabel)
+            setInputValue(selectedLabel);
+    }, [selectedLabel]);
+    return (_jsxs(Combobox, { items: items.map((item) => item.id), value: value ?? null, inputValue: inputValue, autoHighlight: true, disabled: disabled, itemToStringValue: (id) => {
+            const item = itemMap.get(id);
+            return item ? `${item.name}${item.code ? ` · ${item.code}` : ""}` : "";
+        }, onInputValueChange: (next) => {
+            setInputValue(next);
+            setSearch(next);
+            if (!next)
+                onChange(null);
+        }, onValueChange: (next) => {
+            const id = next ?? null;
+            onChange(id);
+            const item = id ? itemMap.get(id) : null;
+            setInputValue(item ? `${item.name}${item.code ? ` · ${item.code}` : ""}` : "");
+        }, children: [_jsx(ComboboxInput, { placeholder: placeholder, showClear: !!value }), _jsxs(ComboboxContent, { children: [_jsx(ComboboxEmpty, { children: listQuery.isPending || selectedQuery.isPending
+                            ? "Loading…"
+                            : "No cancellation fee policies found." }), _jsx(ComboboxList, { children: _jsx(ComboboxCollection, { children: (id) => {
+                                const item = itemMap.get(id);
+                                if (!item)
+                                    return null;
+                                return (_jsx(ComboboxItem, { value: item.id, children: _jsxs("div", { className: "flex min-w-0 flex-col", children: [_jsx("span", { className: "truncate font-medium", children: item.name }), item.code ? (_jsx("span", { className: "truncate text-xs text-muted-foreground", children: item.code })) : null] }) }, item.id));
+                            } }) })] })] }));
+}

package/dist/components/cancellation-policy-rule-dialog.d.ts

@@ -0,0 +1,11 @@
+import { type CancellationPolicyRuleRecord } from "@voyantjs/pricing-react";
+export interface CancellationPolicyRuleDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    policyId: string;
+    rule?: CancellationPolicyRuleRecord;
+    nextSortOrder?: number;
+    onSuccess?: (rule: CancellationPolicyRuleRecord) => void;
+}
+export declare function CancellationPolicyRuleDialog({ open, onOpenChange, policyId, rule, nextSortOrder, onSuccess, }: CancellationPolicyRuleDialogProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=cancellation-policy-rule-dialog.d.ts.map

package/dist/components/cancellation-policy-rule-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cancellation-policy-rule-dialog.d.ts","sourceRoot":"","sources":["../../src/components/cancellation-policy-rule-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,4BAA4B,EAElC,MAAM,yBAAyB,CAAA;AAsChC,MAAM,WAAW,iCAAiC;IAChD,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,QAAQ,EAAE,MAAM,CAAA;IAChB,IAAI,CAAC,EAAE,4BAA4B,CAAA;IACnC,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,4BAA4B,KAAK,IAAI,CAAA;CACzD;AAQD,wBAAgB,4BAA4B,CAAC,EAC3C,IAAI,EACJ,YAAY,EACZ,QAAQ,EACR,IAAI,EACJ,aAAa,EACb,SAAS,GACV,EAAE,iCAAiC,2CAuKnC"}

package/dist/components/cancellation-policy-rule-dialog.js

@@ -0,0 +1,87 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCancellationPolicyRuleMutation, } from "@voyantjs/pricing-react";
+import { Button, Dialog, DialogBody, DialogContent, DialogFooter, DialogHeader, DialogTitle, Input, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Switch, Textarea, } from "@voyantjs/voyant-ui/components";
+import { zodResolver } from "@voyantjs/voyant-ui/lib/zod-resolver";
+import { Loader2 } from "lucide-react";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { z } from "zod/v4";
+const ruleFormSchema = z.object({
+    sortOrder: z.coerce.number().int(),
+    cutoffMinutesBefore: z.coerce.number().int().min(0).optional().or(z.literal("")).nullable(),
+    chargeType: z.enum(["none", "amount", "percentage"]),
+    chargeAmount: z.coerce.number().min(0).optional().or(z.literal("")).nullable(),
+    chargePercent: z.coerce.number().min(0).max(100).optional().or(z.literal("")).nullable(),
+    active: z.boolean(),
+    notes: z.string().optional().nullable(),
+});
+const CHARGE_TYPES = [
+    { value: "none", label: "None" },
+    { value: "amount", label: "Amount" },
+    { value: "percentage", label: "Percentage" },
+];
+export function CancellationPolicyRuleDialog({ open, onOpenChange, policyId, rule, nextSortOrder, onSuccess, }) {
+    const isEditing = !!rule;
+    const { create, update } = useCancellationPolicyRuleMutation();
+    const form = useForm({
+        resolver: zodResolver(ruleFormSchema),
+        defaultValues: {
+            sortOrder: 0,
+            cutoffMinutesBefore: "",
+            chargeType: "percentage",
+            chargeAmount: "",
+            chargePercent: "",
+            active: true,
+            notes: "",
+        },
+    });
+    useEffect(() => {
+        if (open && rule) {
+            form.reset({
+                sortOrder: rule.sortOrder,
+                cutoffMinutesBefore: rule.cutoffMinutesBefore ?? "",
+                chargeType: rule.chargeType,
+                chargeAmount: rule.chargeAmountCents != null ? rule.chargeAmountCents / 100 : "",
+                chargePercent: rule.chargePercentBasisPoints != null ? rule.chargePercentBasisPoints / 100 : "",
+                active: rule.active,
+                notes: rule.notes ?? "",
+            });
+        }
+        else if (open) {
+            form.reset({
+                sortOrder: nextSortOrder ?? 0,
+                cutoffMinutesBefore: "",
+                chargeType: "percentage",
+                chargeAmount: "",
+                chargePercent: "",
+                active: true,
+                notes: "",
+            });
+        }
+    }, [open, rule, nextSortOrder, form]);
+    const chargeType = form.watch("chargeType");
+    const onSubmit = async (values) => {
+        const payload = {
+            cancellationPolicyId: policyId,
+            sortOrder: values.sortOrder,
+            cutoffMinutesBefore: typeof values.cutoffMinutesBefore === "number" ? values.cutoffMinutesBefore : null,
+            chargeType: values.chargeType,
+            chargeAmountCents: values.chargeType === "amount" && typeof values.chargeAmount === "number"
+                ? Math.round(values.chargeAmount * 100)
+                : null,
+            chargePercentBasisPoints: values.chargeType === "percentage" && typeof values.chargePercent === "number"
+                ? Math.round(values.chargePercent * 100)
+                : null,
+            active: values.active,
+            notes: values.notes || null,
+        };
+        const saved = isEditing
+            ? await update.mutateAsync({ id: rule.id, input: payload })
+            : await create.mutateAsync(payload);
+        onSuccess?.(saved);
+        onOpenChange(false);
+    };
+    const isSubmitting = create.isPending || update.isPending;
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: isEditing ? "Edit Rule" : "Add Rule" }) }), _jsxs("form", { onSubmit: form.handleSubmit(onSubmit), children: [_jsxs(DialogBody, { className: "grid gap-4", children: [_jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Cutoff (minutes before)" }), _jsx(Input, { ...form.register("cutoffMinutesBefore"), type: "number", min: "0", placeholder: "2880" }), _jsx("p", { className: "text-xs text-muted-foreground", children: "48h = 2880m \u00B7 24h = 1440m" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Sort order" }), _jsx(Input, { ...form.register("sortOrder"), type: "number" })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Charge type" }), _jsxs(Select, { items: CHARGE_TYPES, value: form.watch("chargeType"), onValueChange: (value) => form.setValue("chargeType", value), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: CHARGE_TYPES.map((type) => (_jsx(SelectItem, { value: type.value, children: type.label }, type.value))) })] })] }), chargeType === "amount" ? (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Charge amount" }), _jsx(Input, { ...form.register("chargeAmount"), type: "number", step: "0.01", min: "0" })] })) : null, chargeType === "percentage" ? (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Charge percent (0-100)" }), _jsx(Input, { ...form.register("chargePercent"), type: "number", step: "0.01", min: "0", max: "100", placeholder: "50" })] })) : null, _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Switch, { checked: form.watch("active"), onCheckedChange: (checked) => form.setValue("active", checked) }), _jsx(Label, { children: "Active" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Notes" }), _jsx(Textarea, { ...form.register("notes") })] })] }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "ghost", onClick: () => onOpenChange(false), children: "Cancel" }), _jsxs(Button, { type: "submit", disabled: isSubmitting, children: [isSubmitting ? _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }) : null, isEditing ? "Save Changes" : "Add Rule"] })] })] })] }) }));
+}

package/dist/components/dropoff-price-rule-dialog.d.ts

@@ -0,0 +1,10 @@
+import { type DropoffPriceRuleRecord } from "@voyantjs/pricing-react";
+type Props = {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    rule?: DropoffPriceRuleRecord;
+    onSuccess?: (rule: DropoffPriceRuleRecord) => void;
+};
+export declare function DropoffPriceRuleDialog({ open, onOpenChange, rule, onSuccess }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=dropoff-price-rule-dialog.d.ts.map

package/dist/components/dropoff-price-rule-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropoff-price-rule-dialog.d.ts","sourceRoot":"","sources":["../../src/components/dropoff-price-rule-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,sBAAsB,EAA+B,MAAM,yBAAyB,CAAA;AAqDlG,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,IAAI,CAAC,EAAE,sBAAsB,CAAA;IAC7B,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,sBAAsB,KAAK,IAAI,CAAA;CACnD,CAAA;AAKD,wBAAgB,sBAAsB,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,KAAK,2CAoLpF"}

package/dist/components/dropoff-price-rule-dialog.js

@@ -0,0 +1,96 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useDropoffPriceRuleMutation } from "@voyantjs/pricing-react";
+import { Button, Dialog, DialogBody, DialogContent, DialogFooter, DialogHeader, DialogTitle, Input, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Switch, Textarea, } from "@voyantjs/voyant-ui/components";
+import { zodResolver } from "@voyantjs/voyant-ui/lib/zod-resolver";
+import { Loader2 } from "lucide-react";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { z } from "zod/v4";
+import { OptionPriceRuleCombobox } from "./option-price-rule-combobox";
+const ADDON_PRICING_MODES = [
+    "included",
+    "per_person",
+    "per_booking",
+    "on_request",
+    "unavailable",
+];
+const formSchema = z.object({
+    optionPriceRuleId: z.string().min(1, "Option price rule is required"),
+    optionId: z.string().min(1, "Option ID is required"),
+    facilityId: z.string().optional().nullable(),
+    dropoffCode: z.string().max(100).optional().nullable(),
+    dropoffName: z.string().min(1, "Dropoff name is required").max(255),
+    pricingMode: z.enum(ADDON_PRICING_MODES),
+    sellAmount: z.coerce.number().min(0).optional().or(z.literal("")).nullable(),
+    costAmount: z.coerce.number().min(0).optional().or(z.literal("")).nullable(),
+    active: z.boolean(),
+    sortOrder: z.coerce.number().int(),
+    notes: z.string().optional().nullable(),
+});
+const toCents = (value) => typeof value === "number" ? Math.round(value * 100) : null;
+export function DropoffPriceRuleDialog({ open, onOpenChange, rule, onSuccess }) {
+    const isEditing = !!rule;
+    const { create, update } = useDropoffPriceRuleMutation();
+    const form = useForm({
+        resolver: zodResolver(formSchema),
+        defaultValues: {
+            optionPriceRuleId: "",
+            optionId: "",
+            facilityId: "",
+            dropoffCode: "",
+            dropoffName: "",
+            pricingMode: "included",
+            sellAmount: "",
+            costAmount: "",
+            active: true,
+            sortOrder: 0,
+            notes: "",
+        },
+    });
+    useEffect(() => {
+        if (open && rule) {
+            form.reset({
+                optionPriceRuleId: rule.optionPriceRuleId,
+                optionId: rule.optionId,
+                facilityId: rule.facilityId ?? "",
+                dropoffCode: rule.dropoffCode ?? "",
+                dropoffName: rule.dropoffName,
+                pricingMode: rule.pricingMode,
+                sellAmount: rule.sellAmountCents != null ? rule.sellAmountCents / 100 : "",
+                costAmount: rule.costAmountCents != null ? rule.costAmountCents / 100 : "",
+                active: rule.active,
+                sortOrder: rule.sortOrder,
+                notes: rule.notes ?? "",
+            });
+        }
+        else if (open) {
+            form.reset();
+        }
+    }, [form, open, rule]);
+    const onSubmit = async (values) => {
+        const payload = {
+            optionPriceRuleId: values.optionPriceRuleId,
+            optionId: values.optionId,
+            facilityId: values.facilityId || null,
+            dropoffCode: values.dropoffCode || null,
+            dropoffName: values.dropoffName,
+            pricingMode: values.pricingMode,
+            sellAmountCents: toCents(values.sellAmount),
+            costAmountCents: toCents(values.costAmount),
+            active: values.active,
+            sortOrder: values.sortOrder,
+            notes: values.notes || null,
+        };
+        const saved = isEditing
+            ? await update.mutateAsync({ id: rule.id, input: payload })
+            : await create.mutateAsync(payload);
+        onSuccess?.(saved);
+        onOpenChange(false);
+    };
+    const isSubmitting = create.isPending || update.isPending;
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { size: "lg", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: isEditing ? "Edit Dropoff Price Rule" : "Add Dropoff Price Rule" }) }), _jsxs("form", { onSubmit: form.handleSubmit(onSubmit), children: [_jsxs(DialogBody, { className: "grid gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Option price rule" }), _jsx(OptionPriceRuleCombobox, { value: form.watch("optionPriceRuleId"), onChange: (value) => form.setValue("optionPriceRuleId", value ?? "", {
+                                                shouldDirty: true,
+                                                shouldValidate: true,
+                                            }), disabled: isEditing }), form.formState.errors.optionPriceRuleId ? (_jsx("p", { className: "text-xs text-destructive", children: form.formState.errors.optionPriceRuleId.message })) : null] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Option ID" }), _jsx(Input, { ...form.register("optionId"), placeholder: "popt_\u2026" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Facility ID (optional)" }), _jsx(Input, { ...form.register("facilityId"), placeholder: "fac_\u2026" })] })] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Dropoff name" }), _jsx(Input, { ...form.register("dropoffName") })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Dropoff code (optional)" }), _jsx(Input, { ...form.register("dropoffCode") })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Pricing mode" }), _jsxs(Select, { items: ADDON_PRICING_MODES.map((x) => ({ label: x.replace(/_/g, " "), value: x })), value: form.watch("pricingMode"), onValueChange: (value) => form.setValue("pricingMode", value), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: ADDON_PRICING_MODES.map((mode) => (_jsx(SelectItem, { value: mode, className: "capitalize", children: mode.replace(/_/g, " ") }, mode))) })] })] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Sell amount" }), _jsx(Input, { ...form.register("sellAmount"), type: "number", step: "0.01", min: "0" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Cost amount" }), _jsx(Input, { ...form.register("costAmount"), type: "number", step: "0.01", min: "0" })] })] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Sort order" }), _jsx(Input, { ...form.register("sortOrder"), type: "number" })] }), _jsxs("div", { className: "flex items-center gap-3 pt-6", children: [_jsx(Switch, { checked: form.watch("active"), onCheckedChange: (checked) => form.setValue("active", checked) }), _jsx(Label, { children: "Active" })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Notes" }), _jsx(Textarea, { ...form.register("notes") })] })] }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "ghost", onClick: () => onOpenChange(false), children: "Cancel" }), _jsxs(Button, { type: "submit", disabled: isSubmitting, children: [isSubmitting ? _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }) : null, isEditing ? "Save Changes" : "Add Rule"] })] })] })] }) }));
+}

package/dist/components/extra-price-rule-dialog.d.ts

@@ -0,0 +1,10 @@
+import { type ExtraPriceRuleRecord } from "@voyantjs/pricing-react";
+type Props = {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    rule?: ExtraPriceRuleRecord;
+    onSuccess?: (rule: ExtraPriceRuleRecord) => void;
+};
+export declare function ExtraPriceRuleDialog({ open, onOpenChange, rule, onSuccess }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=extra-price-rule-dialog.d.ts.map

package/dist/components/extra-price-rule-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"extra-price-rule-dialog.d.ts","sourceRoot":"","sources":["../../src/components/extra-price-rule-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,oBAAoB,EAA6B,MAAM,yBAAyB,CAAA;AAoD9F,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,IAAI,CAAC,EAAE,oBAAoB,CAAA;IAC3B,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAA;CACjD,CAAA;AAKD,wBAAgB,oBAAoB,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,KAAK,2CAyKlF"}

package/dist/components/extra-price-rule-dialog.js

@@ -0,0 +1,92 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useExtraPriceRuleMutation } from "@voyantjs/pricing-react";
+import { Button, Dialog, DialogBody, DialogContent, DialogFooter, DialogHeader, DialogTitle, Input, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Switch, Textarea, } from "@voyantjs/voyant-ui/components";
+import { zodResolver } from "@voyantjs/voyant-ui/lib/zod-resolver";
+import { Loader2 } from "lucide-react";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { z } from "zod/v4";
+import { OptionPriceRuleCombobox } from "./option-price-rule-combobox";
+const ADDON_PRICING_MODES = [
+    "included",
+    "per_person",
+    "per_booking",
+    "on_request",
+    "unavailable",
+];
+const formSchema = z.object({
+    optionPriceRuleId: z.string().min(1, "Option price rule is required"),
+    optionId: z.string().min(1, "Option ID is required"),
+    productExtraId: z.string().optional().nullable(),
+    optionExtraConfigId: z.string().optional().nullable(),
+    pricingMode: z.enum(ADDON_PRICING_MODES),
+    sellAmount: z.coerce.number().min(0).optional().or(z.literal("")).nullable(),
+    costAmount: z.coerce.number().min(0).optional().or(z.literal("")).nullable(),
+    active: z.boolean(),
+    sortOrder: z.coerce.number().int(),
+    notes: z.string().optional().nullable(),
+});
+const toCents = (value) => typeof value === "number" ? Math.round(value * 100) : null;
+export function ExtraPriceRuleDialog({ open, onOpenChange, rule, onSuccess }) {
+    const isEditing = !!rule;
+    const { create, update } = useExtraPriceRuleMutation();
+    const form = useForm({
+        resolver: zodResolver(formSchema),
+        defaultValues: {
+            optionPriceRuleId: "",
+            optionId: "",
+            productExtraId: "",
+            optionExtraConfigId: "",
+            pricingMode: "included",
+            sellAmount: "",
+            costAmount: "",
+            active: true,
+            sortOrder: 0,
+            notes: "",
+        },
+    });
+    useEffect(() => {
+        if (open && rule) {
+            form.reset({
+                optionPriceRuleId: rule.optionPriceRuleId,
+                optionId: rule.optionId,
+                productExtraId: rule.productExtraId ?? "",
+                optionExtraConfigId: rule.optionExtraConfigId ?? "",
+                pricingMode: rule.pricingMode,
+                sellAmount: rule.sellAmountCents != null ? rule.sellAmountCents / 100 : "",
+                costAmount: rule.costAmountCents != null ? rule.costAmountCents / 100 : "",
+                active: rule.active,
+                sortOrder: rule.sortOrder,
+                notes: rule.notes ?? "",
+            });
+        }
+        else if (open) {
+            form.reset();
+        }
+    }, [form, open, rule]);
+    const onSubmit = async (values) => {
+        const payload = {
+            optionPriceRuleId: values.optionPriceRuleId,
+            optionId: values.optionId,
+            productExtraId: values.productExtraId || null,
+            optionExtraConfigId: values.optionExtraConfigId || null,
+            pricingMode: values.pricingMode,
+            sellAmountCents: toCents(values.sellAmount),
+            costAmountCents: toCents(values.costAmount),
+            active: values.active,
+            sortOrder: values.sortOrder,
+            notes: values.notes || null,
+        };
+        const saved = isEditing
+            ? await update.mutateAsync({ id: rule.id, input: payload })
+            : await create.mutateAsync(payload);
+        onSuccess?.(saved);
+        onOpenChange(false);
+    };
+    const isSubmitting = create.isPending || update.isPending;
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { size: "lg", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: isEditing ? "Edit Extra Price Rule" : "Add Extra Price Rule" }) }), _jsxs("form", { onSubmit: form.handleSubmit(onSubmit), children: [_jsxs(DialogBody, { className: "grid gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Option price rule" }), _jsx(OptionPriceRuleCombobox, { value: form.watch("optionPriceRuleId"), onChange: (value) => form.setValue("optionPriceRuleId", value ?? "", {
+                                                shouldDirty: true,
+                                                shouldValidate: true,
+                                            }), disabled: isEditing }), form.formState.errors.optionPriceRuleId ? (_jsx("p", { className: "text-xs text-destructive", children: form.formState.errors.optionPriceRuleId.message })) : null] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Option ID" }), _jsx(Input, { ...form.register("optionId"), placeholder: "popt_\u2026" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Product extra ID (optional)" }), _jsx(Input, { ...form.register("productExtraId"), placeholder: "pext_\u2026" })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Option extra config ID (optional)" }), _jsx(Input, { ...form.register("optionExtraConfigId"), placeholder: "oecf_\u2026" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Pricing mode" }), _jsxs(Select, { items: ADDON_PRICING_MODES.map((x) => ({ label: x.replace(/_/g, " "), value: x })), value: form.watch("pricingMode"), onValueChange: (value) => form.setValue("pricingMode", value), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: ADDON_PRICING_MODES.map((mode) => (_jsx(SelectItem, { value: mode, className: "capitalize", children: mode.replace(/_/g, " ") }, mode))) })] })] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Sell amount" }), _jsx(Input, { ...form.register("sellAmount"), type: "number", step: "0.01", min: "0" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Cost amount" }), _jsx(Input, { ...form.register("costAmount"), type: "number", step: "0.01", min: "0" })] })] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Sort order" }), _jsx(Input, { ...form.register("sortOrder"), type: "number" })] }), _jsxs("div", { className: "flex items-center gap-3 pt-6", children: [_jsx(Switch, { checked: form.watch("active"), onCheckedChange: (checked) => form.setValue("active", checked) }), _jsx(Label, { children: "Active" })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Notes" }), _jsx(Textarea, { ...form.register("notes") })] })] }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "ghost", onClick: () => onOpenChange(false), children: "Cancel" }), _jsxs(Button, { type: "submit", disabled: isSubmitting, children: [isSubmitting ? _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }) : null, isEditing ? "Save Changes" : "Add Rule"] })] })] })] }) }));
+}

package/dist/components/option-price-rule-combobox.d.ts

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

package/dist/components/option-price-rule-combobox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"option-price-rule-combobox.d.ts","sourceRoot":"","sources":["../../src/components/option-price-rule-combobox.tsx"],"names":[],"mappings":"AAgBA,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAA;IAChC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IACxC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAID,wBAAgB,uBAAuB,CAAC,EACtC,KAAK,EACL,QAAQ,EACR,WAA0C,EAC1C,QAAQ,GACT,EAAE,KAAK,2CAsEP"}

package/dist/components/option-price-rule-combobox.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useOptionPriceRule, useOptionPriceRules, } from "@voyantjs/pricing-react";
+import { Combobox, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxList, } from "@voyantjs/voyant-ui/components/combobox";
+import * as React from "react";
+const PAGE_SIZE = 25;
+export function OptionPriceRuleCombobox({ value, onChange, placeholder = "Search option price rules…", disabled, }) {
+    const [search, setSearch] = React.useState("");
+    const listQuery = useOptionPriceRules({ limit: PAGE_SIZE });
+    const selectedQuery = useOptionPriceRule(value, { enabled: !!value });
+    const items = React.useMemo(() => {
+        const map = new Map();
+        for (const item of listQuery.data?.data ?? []) {
+            if (!search || item.name.toLowerCase().includes(search.toLowerCase()))
+                map.set(item.id, item);
+        }
+        if (selectedQuery.data)
+            map.set(selectedQuery.data.id, selectedQuery.data);
+        return Array.from(map.values());
+    }, [listQuery.data?.data, search, selectedQuery.data]);
+    const itemMap = React.useMemo(() => new Map(items.map((item) => [item.id, item])), [items]);
+    const selected = value ? itemMap.get(value) : undefined;
+    const selectedLabel = selected ? selected.name : "";
+    const [inputValue, setInputValue] = React.useState(selectedLabel);
+    React.useEffect(() => {
+        if (selectedLabel)
+            setInputValue(selectedLabel);
+    }, [selectedLabel]);
+    return (_jsxs(Combobox, { items: items.map((item) => item.id), value: value ?? null, inputValue: inputValue, autoHighlight: true, disabled: disabled, itemToStringValue: (id) => itemMap.get(id)?.name ?? "", onInputValueChange: (next) => {
+            setInputValue(next);
+            setSearch(next);
+            if (!next)
+                onChange(null);
+        }, onValueChange: (next) => {
+            const id = next ?? null;
+            onChange(id);
+            setInputValue(id ? (itemMap.get(id)?.name ?? "") : "");
+        }, children: [_jsx(ComboboxInput, { placeholder: placeholder, showClear: !!value }), _jsxs(ComboboxContent, { children: [_jsx(ComboboxEmpty, { children: listQuery.isPending || selectedQuery.isPending
+                            ? "Loading…"
+                            : "No option price rules found." }), _jsx(ComboboxList, { children: _jsx(ComboboxCollection, { children: (id) => {
+                                const item = itemMap.get(id);
+                                if (!item)
+                                    return null;
+                                return (_jsx(ComboboxItem, { value: item.id, children: _jsxs("div", { className: "flex min-w-0 flex-col", children: [_jsx("span", { className: "truncate font-medium", children: item.name }), item.code ? (_jsx("span", { className: "truncate text-xs text-muted-foreground", children: item.code })) : null] }) }, item.id));
+                            } }) })] })] }));
+}

package/dist/components/option-price-rule-dialog.d.ts

@@ -0,0 +1,9 @@
+import { type OptionPriceRuleRecord } from "@voyantjs/pricing-react";
+export interface OptionPriceRuleDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    rule?: OptionPriceRuleRecord;
+    onSuccess?: (rule: OptionPriceRuleRecord) => void;
+}
+export declare function OptionPriceRuleDialog({ open, onOpenChange, rule, onSuccess, }: OptionPriceRuleDialogProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=option-price-rule-dialog.d.ts.map

package/dist/components/option-price-rule-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"option-price-rule-dialog.d.ts","sourceRoot":"","sources":["../../src/components/option-price-rule-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,qBAAqB,EAA8B,MAAM,yBAAyB,CAAA;AAyDhG,MAAM,WAAW,0BAA0B;IACzC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,IAAI,CAAC,EAAE,qBAAqB,CAAA;IAC5B,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,qBAAqB,KAAK,IAAI,CAAA;CAClD;AAKD,wBAAgB,qBAAqB,CAAC,EACpC,IAAI,EACJ,YAAY,EACZ,IAAI,EACJ,SAAS,GACV,EAAE,0BAA0B,2CAwR5B"}