@voyant-travel/storefront-react 0.120.1

package/dist/internal/storefront-settings-form.d.ts

@@ -0,0 +1,50 @@
+import type { StorefrontSettingsPatchInput, StorefrontSettingsRecord } from "../index.js";
+export type SupportLinkRow = {
+    rowKey: string;
+    label: string;
+    url: string;
+};
+export type PaymentMethodCode = NonNullable<StorefrontSettingsRecord["payment"]["defaultMethod"]>;
+export type FormState = {
+    logoUrl: string;
+    faviconUrl: string;
+    brandMarkUrl: string;
+    primaryColor: string;
+    accentColor: string;
+    supportedLanguages: string;
+    supportEmail: string;
+    supportPhone: string;
+    supportLinks: SupportLinkRow[];
+    termsUrl: string;
+    privacyUrl: string;
+    cancellationUrl: string;
+    defaultContractTemplateId: string;
+    defaultLocale: string;
+    currencyDisplay: StorefrontSettingsRecord["localization"]["currencyDisplay"];
+    defaultMethod: PaymentMethodCode | "none";
+    enabledMethods: Record<PaymentMethodCode, boolean>;
+    paymentStructure: StorefrontSettingsRecord["payment"]["structure"];
+    depositPercent: string;
+    balanceDueDaysBeforeDeparture: string;
+    bankTransferDueDays: string;
+    bankProvider: string;
+    bankCurrency: string;
+    accountHolder: string;
+    bankName: string;
+    iban: string;
+    bic: string;
+    paymentReference: string;
+    bankInstructions: string;
+};
+export declare const paymentMethods: Array<{
+    code: PaymentMethodCode;
+    label: string;
+}>;
+export declare const loadingSectionKeys: readonly ["branding", "support", "legal", "payment"];
+export declare const nextSupportLinkKey: () => string;
+export declare const emptyForm: FormState;
+export declare function toFormState(settings?: StorefrontSettingsRecord): FormState;
+export declare function validateForm(form: FormState): "URLs must be valid http or https links." | "Brand colors must use #RGB or #RRGGBB format." | "Deposit percent must be between 0 and 100." | "Balance due days must be a whole number greater than or equal to 0." | "Bank transfer due days must be a whole number greater than or equal to 0." | "The default payment method must be enabled." | null;
+export declare function toPayload(form: FormState): StorefrontSettingsPatchInput;
+export declare function hasEmptySettings(settings?: StorefrontSettingsRecord): boolean;
+//# sourceMappingURL=storefront-settings-form.d.ts.map

package/dist/internal/storefront-settings-form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"storefront-settings-form.d.ts","sourceRoot":"","sources":["../../src/internal/storefront-settings-form.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,4BAA4B,EAAE,wBAAwB,EAAE,MAAM,aAAa,CAAA;AAEzF,MAAM,MAAM,cAAc,GAAG;IAC3B,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;IACb,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG,WAAW,CAAC,wBAAwB,CAAC,SAAS,CAAC,CAAC,eAAe,CAAC,CAAC,CAAA;AAEjG,MAAM,MAAM,SAAS,GAAG;IACtB,OAAO,EAAE,MAAM,CAAA;IACf,UAAU,EAAE,MAAM,CAAA;IAClB,YAAY,EAAE,MAAM,CAAA;IACpB,YAAY,EAAE,MAAM,CAAA;IACpB,WAAW,EAAE,MAAM,CAAA;IACnB,kBAAkB,EAAE,MAAM,CAAA;IAC1B,YAAY,EAAE,MAAM,CAAA;IACpB,YAAY,EAAE,MAAM,CAAA;IACpB,YAAY,EAAE,cAAc,EAAE,CAAA;IAC9B,QAAQ,EAAE,MAAM,CAAA;IAChB,UAAU,EAAE,MAAM,CAAA;IAClB,eAAe,EAAE,MAAM,CAAA;IACvB,yBAAyB,EAAE,MAAM,CAAA;IACjC,aAAa,EAAE,MAAM,CAAA;IACrB,eAAe,EAAE,wBAAwB,CAAC,cAAc,CAAC,CAAC,iBAAiB,CAAC,CAAA;IAC5E,aAAa,EAAE,iBAAiB,GAAG,MAAM,CAAA;IACzC,cAAc,EAAE,MAAM,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAAA;IAClD,gBAAgB,EAAE,wBAAwB,CAAC,SAAS,CAAC,CAAC,WAAW,CAAC,CAAA;IAClE,cAAc,EAAE,MAAM,CAAA;IACtB,6BAA6B,EAAE,MAAM,CAAA;IACrC,mBAAmB,EAAE,MAAM,CAAA;IAC3B,YAAY,EAAE,MAAM,CAAA;IACpB,YAAY,EAAE,MAAM,CAAA;IACpB,aAAa,EAAE,MAAM,CAAA;IACrB,QAAQ,EAAE,MAAM,CAAA;IAChB,IAAI,EAAE,MAAM,CAAA;IACZ,GAAG,EAAE,MAAM,CAAA;IACX,gBAAgB,EAAE,MAAM,CAAA;IACxB,gBAAgB,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC;IAAE,IAAI,EAAE,iBAAiB,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAM5E,CAAA;AAED,eAAO,MAAM,kBAAkB,sDAAuD,CAAA;AAGtF,eAAO,MAAM,kBAAkB,cAA2C,CAAA;AAE1E,eAAO,MAAM,SAAS,EAAE,SAoCvB,CAAA;AAqBD,wBAAgB,WAAW,CAAC,QAAQ,CAAC,EAAE,wBAAwB,GAAG,SAAS,CAgD1E;AAED,wBAAgB,YAAY,CAAC,IAAI,EAAE,SAAS,2VAwC3C;AAED,wBAAgB,SAAS,CAAC,IAAI,EAAE,SAAS,GAAG,4BAA4B,CAgGvE;AAED,wBAAgB,gBAAgB,CAAC,QAAQ,CAAC,EAAE,wBAAwB,WAUnE"}

package/dist/internal/storefront-settings-form.js

@@ -0,0 +1,246 @@
+export const paymentMethods = [
+    { code: "card", label: "Card" },
+    { code: "bank_transfer", label: "Bank transfer" },
+    { code: "cash", label: "Cash" },
+    { code: "voucher", label: "Voucher" },
+    { code: "invoice", label: "Invoice" },
+];
+export const loadingSectionKeys = ["branding", "support", "legal", "payment"];
+let supportLinkSeq = 0;
+export const nextSupportLinkKey = () => `support-link-${++supportLinkSeq}`;
+export const emptyForm = {
+    logoUrl: "",
+    faviconUrl: "",
+    brandMarkUrl: "",
+    primaryColor: "",
+    accentColor: "",
+    supportedLanguages: "",
+    supportEmail: "",
+    supportPhone: "",
+    supportLinks: [],
+    termsUrl: "",
+    privacyUrl: "",
+    cancellationUrl: "",
+    defaultContractTemplateId: "",
+    defaultLocale: "",
+    currencyDisplay: "code",
+    defaultMethod: "none",
+    enabledMethods: {
+        card: false,
+        bank_transfer: false,
+        cash: false,
+        voucher: false,
+        invoice: false,
+    },
+    paymentStructure: "full",
+    depositPercent: "",
+    balanceDueDaysBeforeDeparture: "",
+    bankTransferDueDays: "",
+    bankProvider: "",
+    bankCurrency: "",
+    accountHolder: "",
+    bankName: "",
+    iban: "",
+    bic: "",
+    paymentReference: "",
+    bankInstructions: "",
+};
+function optional(value) {
+    const trimmed = value.trim();
+    return trimmed ? trimmed : null;
+}
+function urlLooksValid(value) {
+    if (!value.trim())
+        return true;
+    try {
+        const url = new URL(value);
+        return url.protocol === "http:" || url.protocol === "https:";
+    }
+    catch {
+        return false;
+    }
+}
+function colorLooksValid(value) {
+    return !value.trim() || /^#(?:[0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(value.trim());
+}
+export function toFormState(settings) {
+    if (!settings)
+        return emptyForm;
+    return {
+        logoUrl: settings.branding.logoUrl ?? "",
+        faviconUrl: settings.branding.faviconUrl ?? "",
+        brandMarkUrl: settings.branding.brandMarkUrl ?? "",
+        primaryColor: settings.branding.primaryColor ?? "",
+        accentColor: settings.branding.accentColor ?? "",
+        supportedLanguages: settings.branding.supportedLanguages.join(", "),
+        supportEmail: settings.support.email ?? "",
+        supportPhone: settings.support.phone ?? "",
+        supportLinks: settings.support.links.map((link) => ({
+            rowKey: nextSupportLinkKey(),
+            label: link.label,
+            url: link.url,
+        })),
+        termsUrl: settings.legal.termsUrl ?? "",
+        privacyUrl: settings.legal.privacyUrl ?? "",
+        cancellationUrl: settings.legal.cancellationUrl ?? "",
+        defaultContractTemplateId: settings.legal.defaultContractTemplateId ?? "",
+        defaultLocale: settings.localization.defaultLocale ?? "",
+        currencyDisplay: settings.localization.currencyDisplay,
+        defaultMethod: settings.payment.defaultMethod ?? "none",
+        enabledMethods: Object.fromEntries(paymentMethods.map((method) => [
+            method.code,
+            settings.payment.methods.some((stored) => stored.code === method.code && stored.enabled),
+        ])),
+        paymentStructure: settings.payment.structure,
+        depositPercent: settings.payment.defaultSchedule?.depositPercent?.toString() ?? "",
+        balanceDueDaysBeforeDeparture: settings.payment.defaultSchedule?.balanceDueDaysBeforeDeparture?.toString() ?? "",
+        bankTransferDueDays: settings.payment.bankTransfer?.dueDays?.toString() ?? "",
+        bankProvider: settings.payment.bankTransfer?.account?.provider ?? "",
+        bankCurrency: settings.payment.bankTransfer?.account?.currency ?? "",
+        accountHolder: settings.payment.bankTransfer?.account?.beneficiary ??
+            settings.payment.bankTransfer?.accountHolder ??
+            "",
+        bankName: settings.payment.bankTransfer?.account?.bank ?? settings.payment.bankTransfer?.bankName ?? "",
+        iban: settings.payment.bankTransfer?.account?.iban ?? settings.payment.bankTransfer?.iban ?? "",
+        bic: settings.payment.bankTransfer?.bic ?? "",
+        paymentReference: settings.payment.bankTransfer?.paymentReference ?? "",
+        bankInstructions: settings.payment.bankTransfer?.instructions ?? "",
+    };
+}
+export function validateForm(form) {
+    const urls = [
+        form.logoUrl,
+        form.faviconUrl,
+        form.brandMarkUrl,
+        form.termsUrl,
+        form.privacyUrl,
+        form.cancellationUrl,
+        ...form.supportLinks.map((link) => link.url),
+    ];
+    if (urls.some((url) => !urlLooksValid(url))) {
+        return "URLs must be valid http or https links.";
+    }
+    if (!colorLooksValid(form.primaryColor) || !colorLooksValid(form.accentColor)) {
+        return "Brand colors must use #RGB or #RRGGBB format.";
+    }
+    const deposit = form.depositPercent ? Number(form.depositPercent) : null;
+    if (deposit !== null && (!Number.isFinite(deposit) || deposit < 0 || deposit > 100)) {
+        return "Deposit percent must be between 0 and 100.";
+    }
+    const balanceDue = form.balanceDueDaysBeforeDeparture
+        ? Number(form.balanceDueDaysBeforeDeparture)
+        : null;
+    if (balanceDue !== null && (!Number.isInteger(balanceDue) || balanceDue < 0)) {
+        return "Balance due days must be a whole number greater than or equal to 0.";
+    }
+    const bankDueDays = form.bankTransferDueDays ? Number(form.bankTransferDueDays) : null;
+    if (bankDueDays !== null && (!Number.isInteger(bankDueDays) || bankDueDays < 0)) {
+        return "Bank transfer due days must be a whole number greater than or equal to 0.";
+    }
+    if (form.defaultMethod !== "none" && !form.enabledMethods[form.defaultMethod]) {
+        return "The default payment method must be enabled.";
+    }
+    return null;
+}
+export function toPayload(form) {
+    const supportLinks = form.supportLinks
+        .map((link) => ({ label: link.label.trim(), url: link.url.trim() }))
+        .filter((link) => link.label || link.url);
+    return {
+        branding: {
+            logoUrl: optional(form.logoUrl),
+            faviconUrl: optional(form.faviconUrl),
+            brandMarkUrl: optional(form.brandMarkUrl),
+            primaryColor: optional(form.primaryColor),
+            accentColor: optional(form.accentColor),
+            supportedLanguages: form.supportedLanguages
+                .split(",")
+                .map((value) => value.trim())
+                .filter(Boolean),
+        },
+        support: {
+            email: optional(form.supportEmail),
+            phone: optional(form.supportPhone),
+            links: supportLinks,
+        },
+        legal: {
+            termsUrl: optional(form.termsUrl),
+            privacyUrl: optional(form.privacyUrl),
+            cancellationUrl: optional(form.cancellationUrl),
+            defaultContractTemplateId: optional(form.defaultContractTemplateId),
+        },
+        localization: {
+            defaultLocale: optional(form.defaultLocale),
+            currencyDisplay: form.currencyDisplay,
+        },
+        payment: {
+            defaultMethod: form.defaultMethod === "none" ? null : form.defaultMethod,
+            methods: paymentMethods
+                .filter((method) => form.enabledMethods[method.code])
+                .map((method) => ({ code: method.code })),
+            structure: form.paymentStructure,
+            schedule: form.paymentStructure === "split" && form.depositPercent
+                ? [
+                    {
+                        percent: Number(form.depositPercent),
+                        dueInDays: 0,
+                        dueCondition: "after_booking",
+                    },
+                    {
+                        percent: 100 - Number(form.depositPercent),
+                        dueInDays: form.balanceDueDaysBeforeDeparture
+                            ? Number(form.balanceDueDaysBeforeDeparture)
+                            : 0,
+                        dueCondition: "before_departure",
+                    },
+                ]
+                : [],
+            defaultSchedule: form.depositPercent || form.balanceDueDaysBeforeDeparture
+                ? {
+                    depositPercent: form.depositPercent ? Number(form.depositPercent) : null,
+                    balanceDueDaysBeforeDeparture: form.balanceDueDaysBeforeDeparture
+                        ? Number(form.balanceDueDaysBeforeDeparture)
+                        : null,
+                }
+                : null,
+            bankTransfer: form.bankTransferDueDays ||
+                form.bankProvider ||
+                form.bankCurrency ||
+                form.accountHolder ||
+                form.bankName ||
+                form.iban ||
+                form.bic ||
+                form.paymentReference ||
+                form.bankInstructions
+                ? {
+                    dueDays: form.bankTransferDueDays ? Number(form.bankTransferDueDays) : null,
+                    account: form.iban && form.accountHolder && form.bankName
+                        ? {
+                            provider: optional(form.bankProvider),
+                            currency: optional(form.bankCurrency),
+                            iban: form.iban.trim(),
+                            beneficiary: form.accountHolder.trim(),
+                            bank: form.bankName.trim(),
+                        }
+                        : null,
+                    accountHolder: optional(form.accountHolder),
+                    bankName: optional(form.bankName),
+                    iban: optional(form.iban),
+                    bic: optional(form.bic),
+                    paymentReference: optional(form.paymentReference),
+                    instructions: optional(form.bankInstructions),
+                }
+                : null,
+        },
+    };
+}
+export function hasEmptySettings(settings) {
+    if (!settings)
+        return true;
+    return (!settings.branding.logoUrl &&
+        !settings.support.email &&
+        !settings.support.phone &&
+        !settings.legal.termsUrl &&
+        !settings.payment.defaultMethod &&
+        settings.payment.methods.length === 0);
+}

package/dist/internal/storefront-settings-payment-section.d.ts

@@ -0,0 +1,12 @@
+import { type FormState } from "./storefront-settings-form.js";
+type SetField = <K extends keyof FormState>(key: K, value: FormState[K]) => void;
+export declare function PaymentSection({ form, setField }: {
+    form: FormState;
+    setField: SetField;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function StorefrontSettingsSaveButton({ isSaving, save, }: {
+    isSaving: boolean;
+    save: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=storefront-settings-payment-section.d.ts.map

package/dist/internal/storefront-settings-payment-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"storefront-settings-payment-section.d.ts","sourceRoot":"","sources":["../../src/internal/storefront-settings-payment-section.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAE,KAAK,SAAS,EAAkB,MAAM,+BAA+B,CAAA;AAE9E,KAAK,QAAQ,GAAG,CAAC,CAAC,SAAS,MAAM,SAAS,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,KAAK,IAAI,CAAA;AAEhF,wBAAgB,cAAc,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,QAAQ,EAAE,QAAQ,CAAA;CAAE,2CA2KzF;AAED,wBAAgB,4BAA4B,CAAC,EAC3C,QAAQ,EACR,IAAI,GACL,EAAE;IACD,QAAQ,EAAE,OAAO,CAAA;IACjB,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB,2CASA"}

package/dist/internal/storefront-settings-payment-section.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Checkbox, Input, Textarea, } from "@voyant-travel/ui/components";
+import { Field, FieldGroup, FieldLabel, FieldLegend, FieldSet, } from "@voyant-travel/ui/components/field";
+import { Loader2, Save } from "lucide-react";
+import { paymentMethods } from "./storefront-settings-form.js";
+export function PaymentSection({ form, setField }) {
+    return (_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Payment defaults" }), _jsx(CardDescription, { children: "Default payment methods, schedules, and bank details." })] }), _jsx(CardContent, { children: _jsxs(FieldGroup, { children: [_jsxs(FieldSet, { children: [_jsx(FieldLegend, { children: "Payment methods" }), _jsx("div", { className: "grid grid-cols-1 gap-2 md:grid-cols-2", children: paymentMethods.map((method) => (_jsxs(Field, { orientation: "horizontal", children: [_jsx(Checkbox, { id: `storefront-payment-${method.code}`, checked: form.enabledMethods[method.code], onCheckedChange: (checked) => setField("enabledMethods", {
+                                                    ...form.enabledMethods,
+                                                    [method.code]: checked === true,
+                                                }) }), _jsx(FieldLabel, { htmlFor: `storefront-payment-${method.code}`, children: method.label })] }, method.code))) })] }), _jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-3", children: [_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-default-method", children: "Default method" }), _jsxs("select", { id: "storefront-default-method", className: "h-9 rounded-md border bg-background px-3 text-sm", value: form.defaultMethod, onChange: (event) => setField("defaultMethod", event.target.value), children: [_jsx("option", { value: "none", children: "None" }), paymentMethods.map((method) => (_jsx("option", { value: method.code, children: method.label }, method.code)))] })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-payment-structure", children: "Payment structure" }), _jsxs("select", { id: "storefront-payment-structure", className: "h-9 rounded-md border bg-background px-3 text-sm", value: form.paymentStructure, onChange: (event) => setField("paymentStructure", event.target.value), children: [_jsx("option", { value: "full", children: "Full payment" }), _jsx("option", { value: "split", children: "Deposit + balance" })] })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-deposit-percent", children: "Deposit percent" }), _jsx(Input, { id: "storefront-deposit-percent", type: "number", min: 0, max: 100, value: form.depositPercent, onChange: (event) => setField("depositPercent", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-balance-due", children: "Balance due days" }), _jsx(Input, { id: "storefront-balance-due", type: "number", min: 0, value: form.balanceDueDaysBeforeDeparture, onChange: (event) => setField("balanceDueDaysBeforeDeparture", event.target.value) })] })] }), _jsxs(FieldSet, { children: [_jsx(FieldLegend, { children: "Bank transfer details" }), _jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-bank-provider", children: "Provider" }), _jsx(Input, { id: "storefront-bank-provider", value: form.bankProvider, onChange: (event) => setField("bankProvider", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-bank-currency", children: "Currency" }), _jsx(Input, { id: "storefront-bank-currency", value: form.bankCurrency, onChange: (event) => setField("bankCurrency", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-account-holder", children: "Account holder" }), _jsx(Input, { id: "storefront-account-holder", value: form.accountHolder, onChange: (event) => setField("accountHolder", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-bank-name", children: "Bank name" }), _jsx(Input, { id: "storefront-bank-name", value: form.bankName, onChange: (event) => setField("bankName", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-iban", children: "IBAN or account number" }), _jsx(Input, { id: "storefront-iban", value: form.iban, onChange: (event) => setField("iban", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-bic", children: "BIC or routing code" }), _jsx(Input, { id: "storefront-bic", value: form.bic, onChange: (event) => setField("bic", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-bank-due-days", children: "Due days" }), _jsx(Input, { id: "storefront-bank-due-days", type: "number", min: 0, value: form.bankTransferDueDays, onChange: (event) => setField("bankTransferDueDays", event.target.value) })] })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-payment-reference", children: "Payment reference" }), _jsx(Input, { id: "storefront-payment-reference", value: form.paymentReference, onChange: (event) => setField("paymentReference", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-bank-instructions", children: "Instructions" }), _jsx(Textarea, { id: "storefront-bank-instructions", value: form.bankInstructions, onChange: (event) => setField("bankInstructions", event.target.value) })] })] })] }) })] }));
+}
+export function StorefrontSettingsSaveButton({ isSaving, save, }) {
+    return (_jsx("div", { className: "flex justify-end", children: _jsxs(Button, { type: "button", onClick: save, disabled: isSaving, children: [isSaving ? _jsx(Loader2, { className: "size-4 animate-spin" }) : _jsx(Save, { className: "size-4" }), "Save settings"] }) }));
+}

package/dist/internal/storefront-settings-sections.d.ts

@@ -0,0 +1,23 @@
+import { type FormState, type SupportLinkRow } from "./storefront-settings-form.js";
+type SetField = <K extends keyof FormState>(key: K, value: FormState[K]) => void;
+interface SettingsSectionProps {
+    form: FormState;
+    setField: SetField;
+}
+interface SupportSectionProps extends SettingsSectionProps {
+    updateSupportLink: (rowKey: string, patch: Partial<SupportLinkRow>) => void;
+}
+export declare function StorefrontSettingsLoadingSections(): import("react/jsx-runtime").JSX.Element;
+export declare function StorefrontSettingsErrorState({ error, refetch, }: {
+    error: unknown;
+    refetch: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function BrandingSection({ form, setField }: SettingsSectionProps): import("react/jsx-runtime").JSX.Element;
+export declare function SupportSection({ form, setField, updateSupportLink }: SupportSectionProps): import("react/jsx-runtime").JSX.Element;
+export declare function LegalLocalizationSection({ form, setField }: SettingsSectionProps): import("react/jsx-runtime").JSX.Element;
+export declare function StorefrontSettingsSaveError({ localError, mutationError, }: {
+    localError: string | null;
+    mutationError: unknown;
+}): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=storefront-settings-sections.d.ts.map

package/dist/internal/storefront-settings-sections.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"storefront-settings-sections.d.ts","sourceRoot":"","sources":["../../src/internal/storefront-settings-sections.tsx"],"names":[],"mappings":"AAqBA,OAAO,EACL,KAAK,SAAS,EAGd,KAAK,cAAc,EACpB,MAAM,+BAA+B,CAAA;AAEtC,KAAK,QAAQ,GAAG,CAAC,CAAC,SAAS,MAAM,SAAS,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,KAAK,IAAI,CAAA;AAEhF,UAAU,oBAAoB;IAC5B,IAAI,EAAE,SAAS,CAAA;IACf,QAAQ,EAAE,QAAQ,CAAA;CACnB;AAED,UAAU,mBAAoB,SAAQ,oBAAoB;IACxD,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAA;CAC5E;AAED,wBAAgB,iCAAiC,4CAkBhD;AAED,wBAAgB,4BAA4B,CAAC,EAC3C,KAAK,EACL,OAAO,GACR,EAAE;IACD,KAAK,EAAE,OAAO,CAAA;IACd,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB,2CAmBA;AAED,wBAAgB,eAAe,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,oBAAoB,2CAoEvE;AAED,wBAAgB,cAAc,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,iBAAiB,EAAE,EAAE,mBAAmB,2CAwFxF;AAED,wBAAgB,wBAAwB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,oBAAoB,2CAuEhF;AAED,wBAAgB,2BAA2B,CAAC,EAC1C,UAAU,EACV,aAAa,GACd,EAAE;IACD,UAAU,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,aAAa,EAAE,OAAO,CAAA;CACvB,kDAWA"}

package/dist/internal/storefront-settings-sections.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Input, } from "@voyant-travel/ui/components";
+import { Field, FieldDescription, FieldGroup, FieldLabel, FieldLegend, FieldSet, } from "@voyant-travel/ui/components/field";
+import { Skeleton } from "@voyant-travel/ui/components/skeleton";
+import { AlertCircle, Plus, Trash2 } from "lucide-react";
+import { loadingSectionKeys, nextSupportLinkKey, } from "./storefront-settings-form.js";
+export function StorefrontSettingsLoadingSections() {
+    return (_jsx("div", { className: "grid grid-cols-1 gap-4 xl:grid-cols-2", children: loadingSectionKeys.map((key) => (_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(Skeleton, { className: "h-5 w-40" }), _jsx(Skeleton, { className: "h-4 w-64" })] }), _jsxs(CardContent, { className: "space-y-3", children: [_jsx(Skeleton, { className: "h-9 w-full" }), _jsx(Skeleton, { className: "h-9 w-full" }), _jsx(Skeleton, { className: "h-9 w-2/3" })] })] }, key))) }));
+}
+export function StorefrontSettingsErrorState({ error, refetch, }) {
+    return (_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsxs(CardTitle, { className: "flex items-center gap-2", children: [_jsx(AlertCircle, { className: "size-5 text-destructive" }), "Could not load settings"] }), _jsx(CardDescription, { children: error instanceof Error ? error.message : "The storefront settings request failed." })] }), _jsx(CardFooter, { children: _jsx(Button, { type: "button", variant: "outline", onClick: refetch, children: "Try again" }) })] }));
+}
+export function BrandingSection({ form, setField }) {
+    return (_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Branding" }), _jsx(CardDescription, { children: "Customer-facing assets and brand color tokens." })] }), _jsx(CardContent, { children: _jsxs(FieldGroup, { children: [_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-logo-url", children: "Logo URL" }), _jsx(Input, { id: "storefront-logo-url", value: form.logoUrl, onChange: (event) => setField("logoUrl", event.target.value), placeholder: "https://cdn.example.com/logo.svg" })] }), _jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-favicon-url", children: "Favicon URL" }), _jsx(Input, { id: "storefront-favicon-url", value: form.faviconUrl, onChange: (event) => setField("faviconUrl", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-brand-mark-url", children: "Brand mark URL" }), _jsx(Input, { id: "storefront-brand-mark-url", value: form.brandMarkUrl, onChange: (event) => setField("brandMarkUrl", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-primary-color", children: "Primary color" }), _jsx(Input, { id: "storefront-primary-color", value: form.primaryColor, onChange: (event) => setField("primaryColor", event.target.value), placeholder: "#0f766e" })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-accent-color", children: "Accent color" }), _jsx(Input, { id: "storefront-accent-color", value: form.accentColor, onChange: (event) => setField("accentColor", event.target.value), placeholder: "#f59e0b" })] })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-supported-languages", children: "Supported languages" }), _jsx(Input, { id: "storefront-supported-languages", value: form.supportedLanguages, onChange: (event) => setField("supportedLanguages", event.target.value), placeholder: "en, ro, fr-FR" }), _jsx(FieldDescription, { children: "Use comma-separated BCP 47 language tags." })] })] }) })] }));
+}
+export function SupportSection({ form, setField, updateSupportLink }) {
+    return (_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Support" }), _jsx(CardDescription, { children: "Contact channels shown to storefront customers." })] }), _jsx(CardContent, { children: _jsxs(FieldGroup, { children: [_jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-support-email", children: "Email" }), _jsx(Input, { id: "storefront-support-email", type: "email", value: form.supportEmail, onChange: (event) => setField("supportEmail", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-support-phone", children: "Phone" }), _jsx(Input, { id: "storefront-support-phone", value: form.supportPhone, onChange: (event) => setField("supportPhone", event.target.value) })] })] }), _jsxs(FieldSet, { children: [_jsx(FieldLegend, { children: "Contact links" }), _jsxs("div", { className: "space-y-2", children: [form.supportLinks.map((link) => (_jsxs("div", { className: "grid grid-cols-1 gap-2 md:grid-cols-[minmax(0,1fr)_minmax(0,1fr)_auto]", children: [_jsx(Input, { value: link.label, onChange: (event) => updateSupportLink(link.rowKey, { label: event.target.value }), placeholder: "WhatsApp", "aria-label": "Contact link label" }), _jsx(Input, { value: link.url, onChange: (event) => updateSupportLink(link.rowKey, { url: event.target.value }), placeholder: "https://example.com/contact", "aria-label": "Contact link URL" }), _jsx(Button, { type: "button", variant: "ghost", size: "icon", onClick: () => setField("supportLinks", form.supportLinks.filter((row) => row.rowKey !== link.rowKey)), "aria-label": "Remove contact link", children: _jsx(Trash2, { className: "size-4" }) })] }, link.rowKey))), _jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setField("supportLinks", [
+                                                ...form.supportLinks,
+                                                { rowKey: nextSupportLinkKey(), label: "", url: "" },
+                                            ]), children: [_jsx(Plus, { className: "size-4" }), "Add link"] })] })] })] }) })] }));
+}
+export function LegalLocalizationSection({ form, setField }) {
+    return (_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Legal and localization" }), _jsx(CardDescription, { children: "Policy links and default display preferences." })] }), _jsx(CardContent, { children: _jsx(FieldGroup, { children: _jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-terms-url", children: "Terms URL" }), _jsx(Input, { id: "storefront-terms-url", value: form.termsUrl, onChange: (event) => setField("termsUrl", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-privacy-url", children: "Privacy URL" }), _jsx(Input, { id: "storefront-privacy-url", value: form.privacyUrl, onChange: (event) => setField("privacyUrl", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-cancellation-url", children: "Cancellation URL" }), _jsx(Input, { id: "storefront-cancellation-url", value: form.cancellationUrl, onChange: (event) => setField("cancellationUrl", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-contract-template", children: "Contract template ID" }), _jsx(Input, { id: "storefront-contract-template", value: form.defaultContractTemplateId, onChange: (event) => setField("defaultContractTemplateId", event.target.value) })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-default-locale", children: "Default locale" }), _jsx(Input, { id: "storefront-default-locale", value: form.defaultLocale, onChange: (event) => setField("defaultLocale", event.target.value), placeholder: "en-US" })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: "storefront-currency-display", children: "Currency display" }), _jsxs("select", { id: "storefront-currency-display", className: "h-9 rounded-md border bg-background px-3 text-sm", value: form.currencyDisplay, onChange: (event) => setField("currencyDisplay", event.target.value), children: [_jsx("option", { value: "code", children: "Code" }), _jsx("option", { value: "symbol", children: "Symbol" }), _jsx("option", { value: "name", children: "Name" })] })] })] }) }) })] }));
+}
+export function StorefrontSettingsSaveError({ localError, mutationError, }) {
+    if (!localError && !mutationError)
+        return null;
+    return (_jsx("p", { className: "rounded-md border border-destructive/30 bg-destructive/5 p-3 text-sm text-destructive", children: localError ??
+            (mutationError instanceof Error
+                ? mutationError.message
+                : "Failed to save storefront settings.") }));
+}