@evinvest/kitstart 0.9.0 → 0.11.0

package/dist/next/booking-route.js

@@ -0,0 +1,97 @@
+import { leadRef } from "../core/accept.js";
+import { bookingRequestProblems, parseBookingRequest } from "../core/booking/validate.js";
+import { openLeadStore } from "../server/lead-store.js";
+const MAX_BODY = 4 * 1024;
+const DAY_MS = 86_400_000;
+/** How far ahead a preferred day may be; a day already past (a day's slack for time zones) is refused. */
+const MAX_AHEAD_DAYS = 366;
+const SUBMISSION = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/;
+function json(status, body) {
+    return new Response(JSON.stringify(body), { status, headers: { "Content-Type": "application/json", "Cache-Control": "no-store" } });
+}
+const isObject = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
+function inWindow(day, now) {
+    const at = Date.parse(`${day}T00:00:00Z`);
+    return at >= now - 2 * DAY_MS && at <= now + MAX_AHEAD_DAYS * DAY_MS;
+}
+/** The body as text, or `null` past `MAX_BODY` — counted as it arrives, since a chunked body has no length. */
+async function readCapped(request) {
+    if (Number(request.headers.get("content-length") ?? 0) > MAX_BODY)
+        return null;
+    if (!request.body)
+        return "";
+    const reader = request.body.getReader();
+    const chunks = [];
+    let size = 0;
+    for (;;) {
+        const { done, value } = await reader.read();
+        if (done)
+            break;
+        size += value.byteLength;
+        if (size > MAX_BODY) {
+            await reader.cancel();
+            return null;
+        }
+        chunks.push(value);
+    }
+    const decoder = new TextDecoder();
+    return chunks.map(c => decoder.decode(c, { stream: true })).join("") + decoder.decode();
+}
+export function bookingRoute(deps) {
+    const log = deps.log ?? console;
+    const now = deps.now ?? Date.now;
+    let store;
+    let webhook;
+    return async (request) => {
+        // A cross-origin page cannot send this type without a preflight, which
+        // this route never answers: the JSON type is the CSRF check.
+        if (!(request.headers.get("content-type") ?? "").startsWith("application/json"))
+            return json(415, { ok: false });
+        const text = await readCapped(request);
+        if (text === null)
+            return json(413, { ok: false });
+        let body;
+        try {
+            body = JSON.parse(text);
+        }
+        catch {
+            return json(400, { ok: false });
+        }
+        if (!isObject(body))
+            return json(400, { ok: false });
+        const { submission, ...properties } = body;
+        if (typeof submission !== "string" || !SUBMISSION.test(submission))
+            return json(422, { ok: false });
+        if (bookingRequestProblems(properties).length > 0)
+            return json(422, { ok: false });
+        const booking = parseBookingRequest(properties);
+        if (booking.preferredDate !== undefined && !inWindow(booking.preferredDate, now()))
+            return json(422, { ok: false });
+        let found;
+        try {
+            store ??= deps.store ? deps.store() : openLeadStore(deps.env().leadsDb);
+            if (!store.findSubmission)
+                return json(501, { ok: false });
+            found = await store.findSubmission(submission);
+        }
+        catch (error) {
+            log.error("booking: the lead store could not be read", error);
+            return json(503, { ok: false });
+        }
+        if (!found || leadRef(found.id, submission) !== booking.leadRef)
+            return json(404, { ok: false });
+        // Booking follows a priced lead; a quote's slot is set on the call.
+        if (found.lead.flow !== "estimate" && found.lead.flow !== "fixed")
+            return json(409, { ok: false });
+        if (webhook === undefined) {
+            webhook = deps.webhook?.() ?? null;
+            webhook?.start();
+        }
+        // Sent by the outbox's own timer, like a lead's retry: the visitor waits for nothing.
+        const queued = webhook?.requestBooking?.(booking) ?? { kind: "off" };
+        // The lead stays in the leads file for a person; the panel never heard of it.
+        if (queued.kind === "unqueued")
+            log.warn(`booking: lead ${found.id} asked for a ${booking.provider} slot but was never sent to the panel; not queued`);
+        return json(200, { ok: true, queued: queued.kind === "queued" });
+    };
+}

package/dist/next/confirm-route.d.ts

@@ -0,0 +1,39 @@
+import { type LeadCaptureText } from "../core/lead-capture-text.js";
+import { type Site } from "../core/site.js";
+import type { PricingSource } from "../server/pricing-source.js";
+/**
+ * `app/quote/confirm/route.ts` — where a form posted without a script lands
+ * when the price it showed has changed (`price_changed`). Its page may be a
+ * cached render (ISR) that still shows the old price, so sending it back there
+ * would refuse every resubmit; this page is never cached. It prices the
+ * answers afresh, says the price changed, and asks to confirm: a form posting
+ * to `/quote` with the fresh price as `shown_cents`.
+ *
+ * ```ts
+ * export const dynamic = "force-dynamic";
+ * export const GET = confirmRoute(site, { pricing });
+ * ```
+ *
+ * The URL carries only what the visitor chose — the need, the answers, the
+ * page's ids and the price they saw — never what they typed: the phone and
+ * the postcode are asked again. A brand's extra fields are not carried.
+ */
+export interface ConfirmRouteDeps<L extends string> {
+    /** The price list the quote route prices with; absent → `site.pricing`. */
+    pricing?: PricingSource;
+    /** The form's words; the kit's in the page's language by default. */
+    text?: (locale: L) => LeadCaptureText;
+    /** The quote route's path; `/quote`. */
+    action?: string;
+    now?: () => number;
+}
+export declare const CONFIRM_PATH = "/quote/confirm";
+/** The price the visitor saw, in the confirmation's query. */
+export declare const SHOWN_PARAM = "shown";
+/**
+ * The confirmation's query for a refused form: the fields the visitor chose
+ * and the page's own ids, slugs only, and the price shown. Used by the quote
+ * route; nothing typed goes in it.
+ */
+export declare function confirmQuery(site: Pick<Site<string, string>, "lead">, form: FormData): URLSearchParams;
+export declare function confirmRoute<L extends string, P extends string>(site: Site<L, P>, deps?: ConfirmRouteDeps<L>): (request: Request) => Promise<Response>;

package/dist/next/confirm-route.js

@@ -0,0 +1,118 @@
+import { EXPERIMENT_FIELD, FORM_ID_FIELD, LOCALE_FIELD, LOCATION_FIELD, SHOWN_CENTS_FIELD, VARIANT_FIELD } from "../core/accept.js";
+import { HONEYPOT_FIELD, RENDERED_AT_FIELD } from "../core/antispam.js";
+import { CARD_FIELD, CARD_ID, SUBMISSION_FIELD, SUBMISSION_ID } from "../core/lead.js";
+import { fillText, formatCents } from "../core/lead-capture-format.js";
+import { flowTextOf, LEAD_CAPTURE_TEXT } from "../core/lead-capture-text.js";
+import { createPlaceView } from "../core/place/view.js";
+import { estimateField, flowOf, readEstimateInputs } from "../core/pricing/flow.js";
+import { PRICING_LIMITS } from "../core/pricing/model.js";
+import { priceOf } from "../core/pricing/price.js";
+import { createRouting } from "../core/routing.js";
+import { bakedPlace } from "../core/site.js";
+export const CONFIRM_PATH = "/quote/confirm";
+/** The price the visitor saw, in the confirmation's query. */
+export const SHOWN_PARAM = "shown";
+const escape = (s) => s.replace(/[&<>"']/g, c => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" })[c] ?? c);
+const SLUG = /^[a-z0-9_-]{1,40}$/;
+const CENTS = /^\d{1,12}$/;
+/**
+ * The confirmation's query for a refused form: the fields the visitor chose
+ * and the page's own ids, slugs only, and the price shown. Used by the quote
+ * route; nothing typed goes in it.
+ */
+export function confirmQuery(site, form) {
+    const query = new URLSearchParams();
+    const keep = (name, test) => {
+        const value = form.get(name);
+        if (typeof value === "string" && test.test(value))
+            query.set(name, value);
+    };
+    for (const name of [LOCALE_FIELD, LOCATION_FIELD, FORM_ID_FIELD, EXPERIMENT_FIELD, VARIANT_FIELD])
+        keep(name, SLUG);
+    keep(CARD_FIELD, CARD_ID);
+    keep(SUBMISSION_FIELD, SUBMISSION_ID);
+    const subject = form.get(site.lead.wire.subject);
+    if (typeof subject === "string" && site.lead.subjects.includes(subject))
+        query.set(site.lead.wire.subject, subject);
+    for (const [name, value] of form) {
+        if (name.startsWith("estimate_") && typeof value === "string" && PRICING_LIMITS.slug.test(value) && SLUG.test(name.slice("estimate_".length)))
+            query.set(name, value);
+    }
+    const shown = form.get(SHOWN_CENTS_FIELD);
+    if (typeof shown === "string" && CENTS.test(shown))
+        query.set(SHOWN_PARAM, shown);
+    return query;
+}
+function page(lang, title, body) {
+    const html = `<!doctype html><html lang="${escape(lang)}"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><meta name="robots" content="noindex"><title>${escape(title)}</title></head><body style="font-family:system-ui,sans-serif;max-width:32rem;margin:2rem auto;padding:0 1rem;line-height:1.5">${body}</body></html>`;
+    return new Response(html, { status: 200, headers: { "Content-Type": "text/html; charset=utf-8", "Cache-Control": "no-store", "X-Robots-Tag": "noindex" } });
+}
+export function confirmRoute(site, deps = {}) {
+    const routing = createRouting(site);
+    const action = deps.action ?? "/quote";
+    const now = deps.now ?? Date.now;
+    return async (request) => {
+        const url = new URL(request.url);
+        const q = (name) => url.searchParams.get(name);
+        const rawLocale = q(LOCALE_FIELD);
+        const locale = site.i18n.isLocale(rawLocale) ? rawLocale : site.i18n.defaultLocale;
+        const rawSlug = q(LOCATION_FIELD);
+        const place = rawSlug ? bakedPlace(site, rawSlug) : undefined;
+        const card = q(CARD_FIELD);
+        const anchor = card !== null && CARD_ID.test(card) ? card : "quote";
+        const host = request.headers.get("host") ?? url.host;
+        const back = () => {
+            const mode = place && routing.hostSlug(host) === place.slug ? "host" : "path";
+            const location = place ? createPlaceView(site, place, locale, mode).href(`#${anchor}`) : `/${locale}#${anchor}`;
+            return new Response(null, { status: 303, headers: { Location: location, "Cache-Control": "no-store" } });
+        };
+        const need = q(site.lead.wire.subject);
+        if (need === null)
+            return back();
+        let model;
+        try {
+            model = deps.pricing ? await deps.pricing.model() : (site.pricing ?? null);
+        }
+        catch {
+            model = null;
+        }
+        const flow = flowOf(site.lead.flows, model, need);
+        if (flow === "quote" || !model)
+            return back();
+        const inputs = flow === "estimate" ? readEstimateInputs(model, need, name => q(name)) : {};
+        const price = priceOf(model, need, inputs);
+        if (!price)
+            return back();
+        const kit = locale.startsWith("en") ? LEAD_CAPTURE_TEXT.en : LEAD_CAPTURE_TEXT.fr;
+        const base = deps.text?.(locale) ?? kit;
+        const flowText = flowTextOf(base, locale);
+        const fresh = formatCents(price.cents, locale);
+        const shown = q(SHOWN_PARAM);
+        const said = shown !== null && CENTS.test(shown) ? fillText(flowText.priceChanged, { price: fresh, shown: formatCents(Number(shown), locale) }) : flowText.priceChangedGeneric;
+        const hidden = [
+            [site.lead.wire.subject, need],
+            ...Object.entries(inputs).map(([input, option]) => [estimateField(input), option]),
+            [SHOWN_CENTS_FIELD, String(price.cents)],
+            [RENDERED_AT_FIELD, String(now())],
+        ];
+        for (const name of [LOCALE_FIELD, LOCATION_FIELD, FORM_ID_FIELD, EXPERIMENT_FIELD, VARIANT_FIELD, CARD_FIELD, SUBMISSION_FIELD]) {
+            const value = q(name);
+            if (value !== null)
+                hidden.push([name, value]);
+        }
+        const field = (name, label, type, autocomplete) => `<p><label for="${escape(name)}">${escape(label)}</label><br><input id="${escape(name)}" name="${escape(name)}" type="${type}" autocomplete="${autocomplete}" required style="font-size:1rem;padding:.5rem;width:100%"></p>`;
+        const body = [
+            `<h1>${escape(flowText.priceTitle)} : ${escape(fresh)}</h1>`,
+            `<p role="alert">${escape(said)}</p>`,
+            `<p>${escape(flowText.priceNote)}</p>`,
+            `<form method="post" action="${escape(action)}">`,
+            ...hidden.map(([name, value]) => `<input type="hidden" name="${escape(name)}" value="${escape(value)}">`),
+            `<input type="text" name="${HONEYPOT_FIELD}" tabindex="-1" autocomplete="off" value="" aria-hidden="true" style="position:absolute;left:-9999px">`,
+            field(site.lead.wire.locality, base.localityLabel, "text", "postal-code"),
+            field(site.lead.wire.mobile, base.phoneLabel, "tel", "tel"),
+            `<p><button type="submit" style="font-size:1rem;padding:.75rem 1.5rem">${escape(flowText.bookSubmit)}</button></p>`,
+            "</form>",
+        ].join("");
+        return page(site.i18n.hreflangOf(locale), flowText.priceTitle, body);
+    };
+}

package/dist/next/index.d.ts

@@ -10,3 +10,5 @@ export { healthRoute, robotsRoute, sitemapRoute } from "./routes.js";
 export { ogRoute, type OgCard, type OgFont, type OgOptions } from "./og.js";
 export { ogPalette, type OgColours } from "./og-palette.js";
 export { quoteRoute, type QuoteRouteDeps, type UnavailableCopy } from "./quote-route.js";
+export { bookingRoute, type BookingRouteDeps } from "./booking-route.js";
+export { CONFIRM_PATH, confirmQuery, confirmRoute, SHOWN_PARAM, type ConfirmRouteDeps } from "./confirm-route.js";

package/dist/next/index.js

@@ -10,3 +10,5 @@ export { healthRoute, robotsRoute, sitemapRoute } from "./routes.js";
 export { ogRoute } from "./og.js";
 export { ogPalette } from "./og-palette.js";
 export { quoteRoute } from "./quote-route.js";
+export { bookingRoute } from "./booking-route.js";
+export { CONFIRM_PATH, confirmQuery, confirmRoute, SHOWN_PARAM } from "./confirm-route.js";

package/dist/next/quote-route.d.ts

@@ -5,13 +5,15 @@ import { type Site } from "../core/site.js";
 import type { ServerEnv } from "../server/env.js";
 import type { LeadWebhook } from "../server/lead-webhook.js";
 import type { LeadNotifier } from "../server/notify.js";
+import type { PricingSource } from "../server/pricing-source.js";
 /**
  * `app/quote/route.ts` — the no-JS path, and the one that has to keep working:
  * a plain form POST answered with a 303, so a refresh does not resubmit.
  * A refused lead goes back to its card with the field to fix
  * (`/fr?lead_error=phone#devis`); a script asking for JSON (`Accept:
  * application/json`) is answered `422 { ok: false, field }` instead, and
- * `200 { ok: true, location }` for a lead taken.
+ * `200 { ok: true, location, lead, cents? }` for a lead taken — `lead` its
+ * public reference (`leadRef`), `cents` the price the server took it at.
  *
  * ```ts
  * export const dynamic = "force-dynamic";
@@ -38,6 +40,11 @@ export interface QuoteRouteDeps<L extends string> {
     webhook?: () => LeadWebhook | null;
     /** The self-contained 500's words, when the store refused the lead. */
     unavailable: (locale: L, place: Place<L> | null) => UnavailableCopy;
+    /**
+     * The price list an `estimate` or `fixed` lead is priced from — the same
+     * source the page showed (`createPricingSource`); absent → `site.pricing`.
+     */
+    pricing?: PricingSource;
     /** Opened on first use (`next build` imports the route); defaults to `LEADS_DB_URL`'s. */
     store?: () => LeadStore;
     /** Defaults to `env().leadRateLimit`, built on the first lead. */

package/dist/next/quote-route.js

@@ -1,8 +1,9 @@
 import { after } from "next/server.js";
-import { createAcceptLead, EXPERIMENT_FIELD, VARIANT_FIELD } from "../core/accept.js";
+import { CONFIRM_PATH, confirmQuery } from "./confirm-route.js";
+import { createAcceptLead, EXPERIMENT_FIELD, PRICE_CHANGED, VARIANT_FIELD } from "../core/accept.js";
 import { analyticsSink, EVENTS, experimentProps } from "../core/analytics.js";
 import { RateLimiter } from "../core/antispam.js";
-import { CARD_FIELD, CARD_ID, channelOf, LEAD_ERROR_PARAM } from "../core/lead.js";
+import { CARD_FIELD, CARD_ID, channelOf, LEAD_CARD_PARAM, LEAD_ERROR_PARAM } from "../core/lead.js";
 import { createPlaceView } from "../core/place/view.js";
 import { createRouting } from "../core/routing.js";
 import { bakedPlace, contactOf } from "../core/site.js";
@@ -115,7 +116,10 @@ export function quoteRoute(site, deps) {
             query.set("need", subject);
         const posted = form.get(CARD_FIELD);
         const card = typeof posted === "string" && CARD_ID.test(posted) ? posted : anchor;
-        return `?${query}#${card}${channel === "callback" ? "-callback" : ""}`;
+        const target = `${card}${channel === "callback" ? "-callback" : ""}`;
+        // The fragment never reaches the server: the query names the card too.
+        query.set(LEAD_CARD_PARAM, target);
+        return `?${query}#${target}`;
     }
     /** Self-contained: the thing that failed may be the thing that renders pages. */
     function unavailable(slug, locale) {
@@ -148,6 +152,7 @@ export function quoteRoute(site, deps) {
             insert: lead => leadStore().insert(lead),
             findSubmission: async (submissionId) => (await leadStore().findSubmission?.(submissionId)) ?? null,
             sendSuspect: suspectQueued(),
+            ...(deps.pricing ? { pricing: () => deps.pricing?.model() ?? Promise.resolve(null) } : {}),
             defer,
             notify: (lead, id) => {
                 notifier ??= deps.notifier();
@@ -182,18 +187,24 @@ export function quoteRoute(site, deps) {
             // A suspected bot is answered exactly as a person is.
             case "stored": {
                 const location = href(request, outcome.lead.placeSlug, outcome.locale, thanksSuffix(channelOf(outcome.lead)));
-                return scripted ? json(200, { ok: true, location }) : seeOther(location);
+                const price = outcome.lead.price ? { cents: outcome.lead.price.cents } : {};
+                return scripted ? json(200, { ok: true, location, lead: outcome.ref, ...price }) : seeOther(location);
             }
             case "invalid": {
                 const tags = experimentProps(text(form, EXPERIMENT_FIELD), text(form, VARIANT_FIELD));
                 // The field's role and why — never what was typed.
-                const props = { form_id: outcome.formId, channel: outcome.channel, field: outcome.field, reason: "invalid", ...tags };
+                const repriced = outcome.field === PRICE_CHANGED;
+                const props = { form_id: outcome.formId, channel: outcome.channel, field: outcome.field, reason: repriced ? PRICE_CHANGED : "invalid", ...tags };
                 if (env.posthogKey) {
                     const sink = analyticsSink({ key: env.posthogKey, host: env.posthogHost, brandId: site.brand.id }, outcome.slug);
                     defer(() => sink.capture(EVENTS.formReject, props));
                 }
                 if (scripted)
-                    return json(422, { ok: false, field: outcome.field });
+                    return json(422, { ok: false, field: outcome.field, ...(repriced && outcome.cents !== undefined ? { reason: PRICE_CHANGED, cents: outcome.cents } : {}) });
+                // The card's page may be a cached render still showing the old price:
+                // a plain post confirms on a page that is never cached instead.
+                if (repriced)
+                    return seeOther(`${CONFIRM_PATH}?${confirmQuery(site, form)}`);
                 return seeOther(href(request, outcome.slug, outcome.locale, refused(form, outcome.field, outcome.channel)));
             }
             case "failed":

package/dist/react/LeadBooking.d.ts

@@ -0,0 +1,35 @@
+import type { OpenBookingConfig } from "../core/booking/model.js";
+import type { LeadCaptureFlowText } from "../core/lead-capture-text.js";
+import { type BookingAdapters } from "./booking-adapters.js";
+import { type BookingPart } from "./LeadBookingManual.js";
+import type { PartClassNames } from "./parts.js";
+import type { LeadSent } from "./use-lead-submit.js";
+export interface LeadBookingProps {
+    /** The booking chosen for this visitor (`bookingOf(place, variant)`). */
+    booking: OpenBookingConfig;
+    sent: LeadSent;
+    locale: string;
+    text: LeadCaptureFlowText;
+    /** The built-in adapters with the brand's own over them, by provider. */
+    adapters?: BookingAdapters | undefined;
+    /**
+     * The providers' embeds (`BOOKING_EMBEDS`) rather than a new tab — only
+     * once the visitor accepted the provider's cookies. A flag, because a
+     * server component cannot hand a client island an adapter.
+     */
+    embed?: boolean | undefined;
+    formId?: string | undefined;
+    /** Where the request posts; `BOOKING_ACTION` by default. */
+    action?: string | undefined;
+    /** For the `manual` day tiles; the click's clock by default. */
+    now?: number | undefined;
+    classNames?: PartClassNames<BookingPart> | undefined;
+}
+/**
+ * After a priced lead: how the slot is set, through the adapter of the
+ * config's provider. Nothing a provider serves is requested before the visitor's click
+ * — a link the browser opens, or an embed whose script loads on the click.
+ * Without the lead's reference (an old route's answer) there is nothing to
+ * join a booking to, and the card only promises the call.
+ */
+export declare function LeadBooking(props: LeadBookingProps): import("react").JSX.Element | null;

package/dist/react/LeadBooking.js

@@ -0,0 +1,47 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { buttonVariants, cn } from "@evinvest/uikit";
+import { useState } from "react";
+import { BOOKING_EMBEDS, bookingAdapters } from "./booking-adapters.js";
+import { LeadBookingManual } from "./LeadBookingManual.js";
+import { useBooking } from "./use-booking.js";
+function OpenBooking(props) {
+    const { adapter, ctx, report, text, classNames: c } = props;
+    const [booked, setBooked] = useState(false);
+    const onBooked = () => {
+        setBooked(true);
+        report.booked();
+    };
+    const click = () => {
+        void report.requested({ lead_ref: ctx.leadRef, provider: adapter.provider });
+        void adapter.open?.({ ...ctx, onBooked });
+    };
+    const href = adapter.href?.(ctx) ?? null;
+    const look = buttonVariants({ variant: "primary", size: "touch", className: cn("w-full", c?.bookingCta) });
+    if (booked)
+        return _jsx("p", { className: cn("font-medium text-ink", c?.bookingNote), children: text.booked });
+    return (_jsxs("div", { className: cn("flex flex-col gap-3", c?.booking), children: [href !== null ? (_jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", onClick: click, className: look, "data-booking-provider": adapter.provider, children: text.bookCta })) : (_jsx("button", { type: "button", onClick: click, className: look, "data-booking-provider": adapter.provider, children: text.bookCta })), !adapter.prefillsPhone?.(ctx) && _jsx("p", { className: cn("text-sm text-ink-soft", c?.bookingNote), children: text.bookPhoneHint }), _jsx("p", { className: cn("text-sm text-ink-soft", c?.bookingNote), children: text.bookNote })] }));
+}
+/**
+ * After a priced lead: how the slot is set, through the adapter of the
+ * config's provider. Nothing a provider serves is requested before the visitor's click
+ * — a link the browser opens, or an embed whose script loads on the click.
+ * Without the lead's reference (an old route's answer) there is nothing to
+ * join a booking to, and the card only promises the call.
+ */
+export function LeadBooking(props) {
+    const { booking, sent, text, classNames: c } = props;
+    const provider = booking.provider;
+    const report = useBooking(provider, sent.submission ?? "", props.formId ?? "quote", props.action);
+    const proven = sent.lead !== undefined && sent.submission !== undefined;
+    const adapter = bookingAdapters({ ...(props.embed ? BOOKING_EMBEDS : {}), ...props.adapters })[provider];
+    // No reference to join a booking to, or a provider no adapter knows: the call is promised.
+    if (sent.lead === undefined || (provider !== "manual" && (!proven || !adapter)))
+        return _jsx("p", { className: cn("text-ink", c?.bookingNote), children: text.slotCallback });
+    if (provider === "manual")
+        return _jsx(LeadBookingManual, { leadRef: sent.lead, locale: props.locale, now: props.now ?? Date.now(), text: text, report: proven ? report : null, classNames: c });
+    const ctx = { config: booking, leadRef: sent.lead, name: sent.name, phone: sent.phone, locale: props.locale };
+    if (!adapter)
+        return null;
+    return _jsx(OpenBooking, { adapter: adapter, ctx: ctx, report: report, text: text, classNames: c });
+}

package/dist/react/LeadBookingManual.d.ts

@@ -0,0 +1,17 @@
+import type { LeadCaptureFlowText } from "../core/lead-capture-text.js";
+import type { PartClassNames } from "./parts.js";
+import type { BookingReport } from "./use-booking.js";
+export type BookingPart = "booking" | "bookingCta" | "bookingNote" | "prefer" | "preferOption" | "preferSubmit";
+/**
+ * `manual`: the call is promised, and the visitor may say when suits them —
+ * a day of the coming week and a part of the day, both optional, no free
+ * text. Sent as `booking.requested@1`; the operator sets the slot on the call.
+ */
+export declare function LeadBookingManual(props: {
+    leadRef: string;
+    locale: string;
+    now: number;
+    text: LeadCaptureFlowText;
+    report: BookingReport | null;
+    classNames?: PartClassNames<BookingPart> | undefined;
+}): import("react").JSX.Element;

package/dist/react/LeadBookingManual.js

@@ -0,0 +1,50 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, cn } from "@evinvest/uikit";
+import { useMemo, useState } from "react";
+import { PREFERRED_PARTS } from "../core/booking/model.js";
+/** How many days ahead a visitor may prefer: tiles, not a calendar — a tap each. */
+const DAYS_AHEAD = 7;
+/** `YYYY-MM-DD` in the visitor's own calendar, `n` days from `now`. */
+function dayFrom(now, n) {
+    const d = new Date(now);
+    d.setDate(d.getDate() + n);
+    return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, "0")}-${String(d.getDate()).padStart(2, "0")}`;
+}
+function Tiles(props) {
+    return (_jsxs("fieldset", { className: "flex flex-col gap-2", children: [_jsx("legend", { className: "mb-2 text-sm font-medium text-ink", children: props.legend }), _jsx("div", { className: "grid grid-cols-3 gap-2 sm:grid-cols-4", children: props.options.map(o => (_jsxs("label", { className: "relative block cursor-pointer", children: [_jsx("input", { type: "radio", name: props.name, value: o.value, checked: props.value === o.value, onChange: () => props.onChange(o.value), className: "peer absolute inset-0 opacity-0" }), _jsx("span", { className: cn("flex h-full min-h-11 items-center justify-center rounded-[var(--control-radius)] border border-input px-2 py-2 text-center text-sm text-ink transition-colors", "peer-checked:border-primary peer-checked:bg-hover peer-focus-visible:ring-[3px] peer-focus-visible:ring-ring/50", props.className), children: o.label })] }, o.value))) })] }));
+}
+/**
+ * `manual`: the call is promised, and the visitor may say when suits them —
+ * a day of the coming week and a part of the day, both optional, no free
+ * text. Sent as `booking.requested@1`; the operator sets the slot on the call.
+ */
+export function LeadBookingManual(props) {
+    const { text, locale, classNames: c } = props;
+    const [day, setDay] = useState(null);
+    const [part, setPart] = useState(null);
+    const [state, setState] = useState("idle");
+    const days = useMemo(() => {
+        const fmt = new Intl.DateTimeFormat(locale, { weekday: "short", day: "numeric" });
+        return Array.from({ length: DAYS_AHEAD }, (_, i) => {
+            const value = dayFrom(props.now, i + 1);
+            return { value, label: fmt.format(new Date(`${value}T12:00:00`)) };
+        });
+    }, [locale, props.now]);
+    const parts = PREFERRED_PARTS.map(value => ({ value, label: { morning: text.partMorning, afternoon: text.partAfternoon, evening: text.partEvening }[value] }));
+    const report = props.report;
+    const send = async (event) => {
+        event.preventDefault();
+        if (!report || (day === null && part === null))
+            return;
+        setState("busy");
+        const ok = await report.requested({ lead_ref: props.leadRef, provider: "manual", ...(day ? { preferred_date: day } : {}), ...(part ? { preferred_part: part } : {}) });
+        setState(ok ? "sent" : "failed");
+    };
+    let body = null;
+    if (state === "sent")
+        body = _jsx("p", { className: "text-ink", children: text.preferSent });
+    else if (report)
+        body = (_jsxs("form", { onSubmit: send, className: cn("flex flex-col gap-4", c?.prefer), "data-booking-prefer": "", children: [_jsx("p", { className: "text-sm text-ink-soft", children: text.preferTitle }), _jsx(Tiles, { legend: text.preferDay, name: "preferred_date", options: days, value: day, onChange: setDay, className: c?.preferOption }), _jsx(Tiles, { legend: text.preferPart, name: "preferred_part", options: parts, value: part, onChange: setPart, className: c?.preferOption }), state === "failed" && (_jsx("p", { role: "alert", className: "text-sm text-ink", children: text.preferFailed })), _jsx(Button, { type: "submit", variant: "outline", size: "touch", disabled: state === "busy" || (day === null && part === null), className: cn("w-full", c?.preferSubmit), children: text.preferSubmit })] }));
+    return (_jsxs("div", { className: cn("flex flex-col gap-4", c?.booking), children: [_jsx("p", { className: cn("text-ink", c?.bookingNote), children: text.slotCallback }), body] }));
+}

package/dist/react/LeadCapture.d.ts

@@ -1,15 +1,21 @@
 import { type ReactNode } from "react";
 import { type CaptureChannel } from "../core/channels.js";
-import type { LeadWire } from "../core/lead.js";
-import type { LeadCaptureText } from "../core/lead-capture-text.js";
+import { type LeadError, type LeadWire, type PageLeadError } from "../core/lead.js";
+import { type LeadCaptureText } from "../core/lead-capture-text.js";
 import { type Place } from "../core/place/types.js";
+import { type LeadFlows } from "../core/pricing/flow.js";
+import type { PricingModel } from "../core/pricing/model.js";
 import type { FormSelectOption } from "./FormSelect.js";
+import type { BookingAdapters } from "./booking-adapters.js";
+import type { BookingPart } from "./LeadBookingManual.js";
+import { type PricedPart } from "./LeadCapturePriced.js";
 import { type ChannelPart, type Experiment } from "./LeadCaptureChannels.js";
+import { type EstimatePart } from "./LeadCaptureEstimate.js";
 import { type FieldPart } from "./LeadCaptureFields.js";
 import { type LeadCaptureLayout } from "./LeadCaptureNeed.js";
 import type { PartClassNames } from "./parts.js";
 import { type LeadSent } from "./use-lead-submit.js";
-export type LeadCapturePart = "root" | "head" | "title" | "lede" | "form" | "contact" | "submit" | "trust" | "privacy" | "opening" | "others" | "done" | "needs" | "need" | "summary" | FieldPart | ChannelPart;
+export type LeadCapturePart = "root" | "head" | "title" | "lede" | "form" | "contact" | "submit" | "trust" | "privacy" | "opening" | "others" | "done" | "needs" | "need" | "summary" | FieldPart | ChannelPart | EstimatePart | PricedPart | BookingPart;
 export interface LeadCaptureProps {
     /** Its hours order the channels; its service area suggests the commune. */
     place: Place<string>;
@@ -25,6 +31,44 @@ export interface LeadCaptureProps {
     wire: LeadWire;
     /** The brand's subjects with their labels, in order. */
     needs: readonly FormSelectOption[];
+    /**
+     * How each need is sold — `site.lead.flows`, the map the server prices
+     * with. A need runs `estimate` or `fixed` only when `pricing` prices it so
+     * (`flowOf`); otherwise, and without the two, every need is a `quote`.
+     */
+    flows?: LeadFlows | undefined;
+    /**
+     * The price list the page priced from — `createPricingSource(site).model()`
+     * on the server page, handed down as data. An estimate's price is computed
+     * here as the visitor answers, and again by the route, whose number is kept.
+     */
+    pricing?: PricingModel | null | undefined;
+    /**
+     * `quote` needs a price is given from photos (a deep clean, after-works):
+     * a WhatsApp link to send them, prefilled with the need, when the place
+     * has WhatsApp. The callback is offered as always.
+     */
+    photos?: readonly string[] | undefined;
+    /**
+     * After a priced lead: how the slot is set. By default the place's booking
+     * (`place.booking`, `manual` when it has none) for `bookingVariant`,
+     * through its provider's adapter — `LeadBooking`. A node here replaces it
+     * whole.
+     */
+    booking?: ReactNode | ((sent: LeadSent) => ReactNode);
+    /**
+     * The built-in booking adapters with the brand's own over them, by
+     * provider — from a client component only: a server one cannot pass functions.
+     */
+    bookingAdapters?: BookingAdapters | undefined;
+    /**
+     * The variant of the `booking_provider` experiment (`BOOKING_EXPERIMENT`):
+     * the provider this visitor is offered, when the place has it; else the
+     * place's default (`bookingOf`).
+     */
+    bookingVariant?: string | null | undefined;
+    /** The providers' embeds instead of a new tab — only once the visitor accepted their cookies. */
+    bookingEmbed?: boolean | undefined;
     /** The need the page already knows; `?need=` and `[data-need]` triggers set it too. */
     need?: string | undefined;
     /** `single` (one screen) or `qualify-first` (the need, then the contact) — an experiment's switch. */
@@ -66,6 +110,13 @@ export interface LeadCaptureProps {
      * posts as it always did.
      */
     done?: ReactNode | ((sent: LeadSent) => ReactNode);
+    /**
+     * The refusal the page read from its query — `leadErrorOf(searchParams)` —
+     * drawn on the server, so the card says why without a script — by this card
+     * only when the query names it (`lead_card`, `leadErrorFor`). A page built
+     * for ISR has no query to read; there the script says it once it runs.
+     */
+    initialError?: PageLeadError | LeadError | null | undefined;
     /** Replaces the title and lede — the brand's own heading. */
     head?: ReactNode;
     /** Beside the submit: a guarantee, a live rating. */