@organizapp/site-kit 0.0.1 → 0.4.0

package/README.md

@@ -1,15 +1,180 @@
 # @organizapp/site-kit
 
 El kit de los sitios de la web pública de Organizapp: lo que se repite en cada
-sitio y es delicado (los datos del negocio, el formulario de consulta, la
-revalidación). Lo usan los proyectos que salen de la plantilla
+sitio y es delicado. Lo usan los proyectos que salen de la plantilla
 `organizapp-site-template`.
 
-**Vacío en esta versión**: existe para dejar probada la publicación. Las piezas
-llegan con la siguiente etapa.
+**0.4.0: el chat del Asistente**, además de los datos del negocio y el aviso de
+cambio (0.3.0, que no llegó a publicarse sola) y del formulario de consulta con
+la casilla de novedades versionada (0.2.0). La 0.1.0 no se publicó:
+su casilla aceptaba cualquier texto.
 
 No depende de nada interno de Organizapp y no lleva secretos: las credenciales
-de cada sitio van en las variables de entorno de su proyecto. Se publica solo
-desde el workflow `site-kit-publish` del repositorio, con procedencia.
+de cada sitio van en las variables de entorno de su proyecto. React es del sitio
+(`peerDependencies`). Se publica solo desde el workflow `site-kit-publish` del
+repositorio, sin procedencia (npm solo la firma desde un repositorio público).
+
+## Las variables del sitio
+
+Ninguna lleva `NEXT_PUBLIC_`: no pueden llegar al navegador.
+
+| Variable | Qué |
+| --- | --- |
+| `ORGANIZAPP_API_URL` | la URL de la API de Organizapp, por `https` |
+| `ORGANIZAPP_SITE_ID` | el id del sitio, el que muestra el panel |
+| `ORGANIZAPP_SITE_SECRET` | el secreto de la API, que el panel muestra una sola vez |
+| `ORGANIZAPP_REVALIDATION_SECRET` | el secreto del aviso, que el panel muestra junto con el de la API |
+| `TURNSTILE_SECRET_KEY` | opcional: solo si el sitio prende Turnstile |
+
+## Dos entradas
+
+- `@organizapp/site-kit`: lo del **servidor** (firma con el secreto). Nunca se
+  importa desde un Client Component.
+- `@organizapp/site-kit/form`: el formulario y el chat, que corren en el
+  navegador y no conocen ningún secreto.
+
+## El formulario
+
+La página de contacto se dibuja **por pedido** (`dynamic = "force-dynamic"`):
+el sello de hora se firma al dibujarla, y una página estática llevaría el de la
+hora del build.
+
+```tsx
+// app/contacto/page.tsx
+import { createFormSeal } from "@organizapp/site-kit";
+import { InquiryForm } from "@organizapp/site-kit/form";
+import { sendInquiry } from "./actions";
+
+export const dynamic = "force-dynamic";
+
+export default async function Contacto() {
+  const seal = await createFormSeal({ secret: process.env.ORGANIZAPP_SITE_SECRET ?? "", nowMs: Date.now() });
+  return <InquiryForm action={sendInquiry} seal={seal} contact="either" policyHref="/privacidad" businessName="Estudio Sur" />;
+}
+```
+
+```ts
+// app/contacto/actions.ts
+"use server";
+import { headers } from "next/headers";
+import { clientIpFromHeaders, handleInquiryForm, siteConnectionFromEnv, type InquiryFormState } from "@organizapp/site-kit";
+
+export async function sendInquiry(_state: InquiryFormState, data: FormData): Promise<InquiryFormState> {
+  return handleInquiryForm(data, {
+    connection: siteConnectionFromEnv(),
+    clientIp: clientIpFromHeaders(await headers()),
+    sourcePath: "/contacto",
+    policyVersion: "2026-10",
+  });
+}
+```
+
+`contact` repite lo que el sitio eligió en el CRM (`either`, `phone`, `email`,
+`both`): el formulario marca los campos, y la API lo exige igual.
+
+**La casilla de novedades** dice «Quiero recibir novedades de {businessName}
+por WhatsApp.» y arranca sin marcar, como pide la política de opt-in de Meta.
+El texto lo fija el kit y no el sitio: marcada, viaja con
+`MARKETING_OPT_IN_VERSION`, que el CRM guarda como prueba de qué se aceptó. Con
+teléfono, ese «sí» hace que la persona pueda recibir campañas por WhatsApp
+cuando sea contacto del negocio. Cambiar el texto es cambiar la versión.
+
+**Qué hace antes de llamar a la API**, en orden:
+
+1. **Campo trampa**: un campo fuera de la pantalla (no `display:none`), fuera del
+   tab y del árbol de accesibilidad. Lleno, es un bot.
+2. **Sello de hora**: menos de 2 segundos desde que se dibujó, es un bot; más de
+   24 horas, se pide recargar la página.
+3. **Turnstile**, solo si está prendido.
+
+Lo que delata a un bot recibe **las mismas gracias** que un envío bueno y no
+llega a la API: no aprende qué lo delató ni gasta el cupo del sitio.
+
+**La clave de idempotencia** sale del sello y de lo escrito: el mismo envío
+repetido (un doble clic, una red cortada) es un duplicado y no otra consulta;
+corregir un campo después de un error es otro envío.
+
+## Los datos del negocio
+
+`getSiteProfile` lee nombre, eslogan, teléfonos, emails, WhatsApp, dirección,
+mapa, horario y redes. **No cachea**: la firma cambia en cada pedido y la caché
+de `fetch` de Next usa los headers en su clave. El sitio cachea el resultado con
+la etiqueta `SITE_PROFILE_TAG`, y la ruta del aviso la invalida:
+
+```ts
+// lib/profile.ts
+import { unstable_cache } from "next/cache";
+import { SITE_PROFILE_TAG, getSiteProfile, siteConnectionFromEnv } from "@organizapp/site-kit";
+
+export const siteProfile = unstable_cache(
+  () => getSiteProfile(siteConnectionFromEnv()), ["organizapp-site-profile"], { tags: [SITE_PROFILE_TAG] },
+);
+
+// app/api/organizapp/revalidate/route.ts
+import { revalidateTag } from "next/cache";
+import { createRevalidateHandler, revalidationFromEnv } from "@organizapp/site-kit";
+
+export const POST = createRevalidateHandler({ connection: revalidationFromEnv(), revalidate: revalidateTag });
+```
+
+Sin datos guardados en el CRM es `not_set`, y ante un fallo el sitio muestra lo
+último que cacheó. Los teléfonos vienen en dígitos con código de país: el sitio
+elige cómo mostrarlos (`tel:+<número>`, `https://wa.me/<número>`).
+
+## El chat del Asistente
+
+`<SiteChat>` atiende con el Asistente del negocio, **solo cuando está en vivo**
+en el CRM. Si el Asistente deriva, o el chat no está, el widget muestra lo que
+el sitio le pase en `handoff` (el formulario de consulta) y el enlace a
+WhatsApp. No hay chat en vivo con una persona.
+
+La conversación la guarda Organizapp por un día después del último mensaje; el
+navegador no guarda nada. El sitio solo pone una cookie `httpOnly` con el token
+de la sesión, desde su Server Action:
+
+```ts
+// app/chat-actions.ts
+"use server";
+import { cookies, headers } from "next/headers";
+import { CHAT_COOKIE, CHAT_COOKIE_OPTIONS, clientIpFromHeaders, sendChatMessage, siteConnectionFromEnv } from "@organizapp/site-kit";
+import type { SiteChatReply } from "@organizapp/site-kit/form";
+
+export async function sendChat(input: { text: string }): Promise<SiteChatReply> {
+  const clientIp = clientIpFromHeaders(await headers());
+  if (clientIp === null) return { kind: "unavailable" };
+  const jar = await cookies();
+  const { sessionToken, reply } = await sendChatMessage(siteConnectionFromEnv(), {
+    sessionToken: jar.get(CHAT_COOKIE)?.value ?? null, text: input.text, clientIp,
+  });
+  if (sessionToken !== null) jar.set(CHAT_COOKIE, sessionToken, CHAT_COOKIE_OPTIONS);
+  return reply;
+}
+```
+
+```tsx
+// en la página, con el formulario de consulta como salida
+<SiteChat action={sendChat} assistantName="Sofía" whatsapp={profile.whatsapp}
+  handoff={<InquiryForm action={sendInquiry} seal={seal} contact="either" policyHref="/privacidad" businessName="Estudio Sur" />} />
+```
+
+Una sesión admite 30 mensajes; quien escribe de más recibe `busy` («Probá en
+unos minutos»). El widget arranca cerrado, detrás de un botón.
+
+## Turnstile, apagado
+
+Se prende por sitio si aparece spam: `turnstileSiteKey` en `<InquiryForm>` y
+`turnstileSecret: process.env.TURNSTILE_SECRET_KEY` en `handleInquiryForm`. La
+CSP del sitio tiene que dejar `https://challenges.cloudflare.com` en `script-src`
+y `frame-src`.
+
+## Para quien mantiene el kit
+
+- La aserción repite el formato de `packages/service-auth` (que el kit no puede
+  importar): si cambia uno, cambia el otro.
+- Los imports relativos llevan `.js`: Node no resuelve `../x` en un paquete ESM.
+  Lo fija `package-contract.test.ts`.
+- El contrato de la API: `docs/domain/website/inquiries.md` (consultas),
+  `docs/domain/website/profile.md` (datos y aviso) y
+  `docs/domain/website/chat.md` (chat).
 
 Licencia propietaria: ver `LICENSE`.

package/dist/assertion/site-assertion.d.ts

@@ -0,0 +1,35 @@
+/**
+ * La aserción con la que el servidor del sitio se presenta ante la API de
+ * consultas. Repite el formato de `packages/service-auth/src/assertion/service-assertion.ts`
+ * —el kit no puede importar nada interno—: si cambia uno, cambia el otro.
+ *
+ * `v1.<payload base64url>.<firma base64url>`, con el payload
+ * `{ aud, tid, pid, iat, exp, n, sid, ip }`. Sin tenant ni perfil: el CRM saca el
+ * negocio del sitio, nunca de lo que diga el pedido. Vale 60 segundos.
+ *
+ * Cuatro audiencias: `website:inquiry` y `website:chat` (una consulta o un
+ * mensaje del chat, con la IP de quien escribió), `website:profile` (leer los
+ * datos, sin visitante: IP vacía) y `website:revalidate`, la que firma el CRM
+ * con el secreto de revalidación.
+ */
+export type SiteAudience = "website:inquiry" | "website:profile" | "website:revalidate" | "website:chat";
+export declare const SITE_HEADER = "x-organizapp-site";
+export declare const ASSERTION_HEADER = "x-organizapp-assertion";
+export declare function signSiteAssertion(input: {
+    readonly secret: string;
+    readonly siteId: string;
+    readonly clientIp: string;
+    readonly nowSeconds: number;
+    readonly audience?: Exclude<SiteAudience, "website:revalidate">;
+}): Promise<string>;
+/**
+ * Verifica una aserción que firmó el CRM para este sitio: la firma primero, y
+ * recién después se lee el payload. Vencida, de otra audiencia o de otro sitio
+ * es `false`, sin distinguir por qué.
+ */
+export declare function verifySiteAssertion(header: string, expected: {
+    readonly secret: string;
+    readonly audience: SiteAudience;
+    readonly siteId: string;
+    readonly nowSeconds: number;
+}): Promise<boolean>;

package/dist/assertion/site-assertion.js

@@ -0,0 +1,49 @@
+import { base64UrlJson, hmacSign, hmacVerify } from "../crypto/hmac.js";
+const VERSION = "v1";
+const TTL_SECONDS = 60;
+export const SITE_HEADER = "x-organizapp-site";
+export const ASSERTION_HEADER = "x-organizapp-assertion";
+export async function signSiteAssertion(input) {
+    const payload = base64UrlJson({
+        aud: input.audience ?? "website:inquiry",
+        tid: null,
+        pid: null,
+        iat: input.nowSeconds,
+        exp: input.nowSeconds + TTL_SECONDS,
+        n: crypto.randomUUID(),
+        sid: input.siteId,
+        ip: input.clientIp,
+    });
+    const signed = `${VERSION}.${payload}`;
+    return `${signed}.${await hmacSign(input.secret, signed)}`;
+}
+function payloadOf(text) {
+    if (!/^[A-Za-z0-9_-]+$/u.test(text))
+        return null;
+    try {
+        const value = JSON.parse(atob(text.replace(/-/gu, "+").replace(/_/gu, "/")));
+        return typeof value === "object" && value !== null && !Array.isArray(value) ? value : null;
+    }
+    catch {
+        return null;
+    }
+}
+/**
+ * Verifica una aserción que firmó el CRM para este sitio: la firma primero, y
+ * recién después se lee el payload. Vencida, de otra audiencia o de otro sitio
+ * es `false`, sin distinguir por qué.
+ */
+export async function verifySiteAssertion(header, expected) {
+    const [version, payload, signature, extra] = header.split(".");
+    if (version !== VERSION || payload === undefined || signature === undefined || extra !== undefined)
+        return false;
+    if (!(await hmacVerify(expected.secret, `${VERSION}.${payload}`, signature)))
+        return false;
+    const claims = payloadOf(payload);
+    if (claims === null || typeof claims["iat"] !== "number" || typeof claims["exp"] !== "number")
+        return false;
+    return claims["aud"] === expected.audience
+        && claims["sid"] === expected.siteId
+        && claims["exp"] >= expected.nowSeconds
+        && claims["exp"] - claims["iat"] <= TTL_SECONDS;
+}

package/dist/chat/chat-reply.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Lo que el widget muestra después de un mensaje. Lo comparten el servidor del
+ * sitio (`sendChatMessage`) y el navegador (`<SiteChat>`), así que no importa
+ * nada: es solo la forma.
+ *
+ * - `answer`: la respuesta del Asistente.
+ * - `handoff`: el Asistente deriva. El widget ofrece dejar una consulta y
+ *   escribir por WhatsApp; no hay chat en vivo con una persona.
+ * - `busy`: quien escribe mandó demasiados mensajes seguidos.
+ * - `unavailable`: el chat no está (apagado, caído o sin red). El widget ofrece
+ *   lo mismo que una derivación.
+ */
+export type SiteChatReply = {
+    readonly kind: "answer";
+    readonly text: string;
+} | {
+    readonly kind: "handoff";
+} | {
+    readonly kind: "busy";
+} | {
+    readonly kind: "unavailable";
+};

package/dist/chat/chat-reply.js

@@ -0,0 +1 @@
+export {};

package/dist/chat/send-chat-message.d.ts

@@ -0,0 +1,32 @@
+import type { SiteConnection } from "../inquiry/inquiry-fields.js";
+import type { SiteChatReply } from "./chat-reply.js";
+/**
+ * Manda un mensaje del chat del Asistente (W-4) a Organizapp. Corre en el
+ * SERVIDOR del sitio: firma con `ORGANIZAPP_SITE_SECRET` y la IP de quien
+ * escribe, como las consultas.
+ *
+ * La conversación vive en Organizapp, no en el navegador: el sitio guarda solo
+ * el token de la sesión, en la cookie `CHAT_COOKIE` con `CHAT_COOKIE_OPTIONS`
+ * (`httpOnly`, así el JavaScript de la página no lo lee). `sessionToken` es el
+ * que hay que volver a guardar; `null` es «dejá la cookie como está».
+ */
+export declare const CHAT_COOKIE = "organizapp_chat";
+export declare const CHAT_COOKIE_OPTIONS: {
+    readonly httpOnly: true;
+    readonly secure: true;
+    readonly sameSite: "lax";
+    readonly path: "/";
+    readonly maxAge: 86400;
+};
+export interface ChatMessageResult {
+    readonly sessionToken: string | null;
+    readonly reply: SiteChatReply;
+}
+export declare function sendChatMessage(connection: SiteConnection, input: {
+    readonly sessionToken: string | null;
+    readonly text: string;
+    readonly clientIp: string;
+}, deps?: {
+    readonly fetch?: typeof fetch;
+    readonly nowSeconds?: number;
+}): Promise<ChatMessageResult>;

package/dist/chat/send-chat-message.js

@@ -0,0 +1,61 @@
+import { ASSERTION_HEADER, SITE_HEADER, signSiteAssertion } from "../assertion/site-assertion.js";
+/**
+ * Manda un mensaje del chat del Asistente (W-4) a Organizapp. Corre en el
+ * SERVIDOR del sitio: firma con `ORGANIZAPP_SITE_SECRET` y la IP de quien
+ * escribe, como las consultas.
+ *
+ * La conversación vive en Organizapp, no en el navegador: el sitio guarda solo
+ * el token de la sesión, en la cookie `CHAT_COOKIE` con `CHAT_COOKIE_OPTIONS`
+ * (`httpOnly`, así el JavaScript de la página no lo lee). `sessionToken` es el
+ * que hay que volver a guardar; `null` es «dejá la cookie como está».
+ */
+export const CHAT_COOKIE = "organizapp_chat";
+export const CHAT_COOKIE_OPTIONS = { httpOnly: true, secure: true, sameSite: "lax", path: "/", maxAge: 86_400 };
+const TIMEOUT_MS = 30_000;
+const PATH = "/api/sites/v1/chat";
+const UNAVAILABLE = { sessionToken: null, reply: { kind: "unavailable" } };
+function readReply(value) {
+    if (typeof value !== "object" || value === null)
+        return UNAVAILABLE;
+    const { sessionToken, reply } = value;
+    if (typeof sessionToken !== "string" || typeof reply !== "object" || reply === null)
+        return UNAVAILABLE;
+    const { kind, text } = reply;
+    if (kind === "handoff")
+        return { sessionToken, reply: { kind } };
+    if (kind === "answer" && typeof text === "string")
+        return { sessionToken, reply: { kind, text } };
+    return UNAVAILABLE;
+}
+export async function sendChatMessage(connection, input, deps = {}) {
+    const assertion = await signSiteAssertion({
+        secret: connection.siteSecret,
+        siteId: connection.siteId,
+        clientIp: input.clientIp,
+        audience: "website:chat",
+        nowSeconds: deps.nowSeconds ?? Math.floor(Date.now() / 1000),
+    });
+    let response;
+    try {
+        response = await (deps.fetch ?? fetch)(`${connection.apiUrl.replace(/\/+$/u, "")}${PATH}`, {
+            method: "POST",
+            headers: { "content-type": "application/json", [SITE_HEADER]: connection.siteId, [ASSERTION_HEADER]: assertion },
+            body: JSON.stringify({ sessionToken: input.sessionToken, text: input.text }),
+            signal: AbortSignal.timeout(TIMEOUT_MS),
+            cache: "no-store",
+        });
+    }
+    catch {
+        return UNAVAILABLE;
+    }
+    if (response.status === 429)
+        return { sessionToken: null, reply: { kind: "busy" } };
+    if (response.status !== 200)
+        return UNAVAILABLE;
+    try {
+        return readReply(await response.json());
+    }
+    catch {
+        return UNAVAILABLE;
+    }
+}

package/dist/chat/whatsapp-href.d.ts

@@ -0,0 +1,7 @@
+/**
+ * `https://wa.me/<solo dígitos>`, o `null` si no hay número. Vive fuera de
+ * `<SiteChat>` porque ese módulo es de cliente, y una función de un módulo de
+ * cliente no se puede llamar desde un Server Component (el pie del sitio, por
+ * ejemplo).
+ */
+export declare function whatsappHref(phone: string | null): string | null;

package/dist/chat/whatsapp-href.js

@@ -0,0 +1,10 @@
+/**
+ * `https://wa.me/<solo dígitos>`, o `null` si no hay número. Vive fuera de
+ * `<SiteChat>` porque ese módulo es de cliente, y una función de un módulo de
+ * cliente no se puede llamar desde un Server Component (el pie del sitio, por
+ * ejemplo).
+ */
+export function whatsappHref(phone) {
+    const digits = (phone ?? "").replace(/\D/gu, "");
+    return digits === "" ? null : `https://wa.me/${digits}`;
+}

package/dist/crypto/hmac.d.ts

@@ -0,0 +1,5 @@
+export declare function toBase64Url(bytes: Uint8Array): string;
+export declare function hmacBytes(secret: string, text: string): Promise<Uint8Array>;
+export declare function hmacSign(secret: string, text: string): Promise<string>;
+export declare function hmacVerify(secret: string, text: string, signature: string): Promise<boolean>;
+export declare function base64UrlJson(value: unknown): string;

package/dist/crypto/hmac.js

@@ -0,0 +1,47 @@
+/**
+ * HMAC-SHA256 con Web Crypto: corre igual en Node y en Edge, y `subtle.verify`
+ * compara en tiempo constante. Lo usan la aserción y el sello del formulario,
+ * cada uno con su propio prefijo para que una firma de uno no valga en el otro.
+ */
+const encoder = new TextEncoder();
+const MIN_KEY_LENGTH = 16;
+export function toBase64Url(bytes) {
+    let binary = "";
+    for (const byte of bytes)
+        binary += String.fromCharCode(byte);
+    return btoa(binary).replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/, "");
+}
+function fromBase64Url(text) {
+    if (!/^[A-Za-z0-9_-]+$/.test(text))
+        return null;
+    try {
+        const binary = atob(text.replace(/-/g, "+").replace(/_/g, "/"));
+        const bytes = new Uint8Array(binary.length);
+        for (let index = 0; index < binary.length; index += 1)
+            bytes[index] = binary.charCodeAt(index);
+        return bytes;
+    }
+    catch {
+        return null;
+    }
+}
+async function hmacKey(secret) {
+    if (secret.length < MIN_KEY_LENGTH)
+        throw new Error(`el secreto del sitio tiene que tener al menos ${MIN_KEY_LENGTH} caracteres`);
+    return crypto.subtle.importKey("raw", encoder.encode(secret), { name: "HMAC", hash: "SHA-256" }, false, ["sign", "verify"]);
+}
+export async function hmacBytes(secret, text) {
+    return new Uint8Array(await crypto.subtle.sign("HMAC", await hmacKey(secret), encoder.encode(text)));
+}
+export async function hmacSign(secret, text) {
+    return toBase64Url(await hmacBytes(secret, text));
+}
+export async function hmacVerify(secret, text, signature) {
+    const bytes = fromBase64Url(signature);
+    if (bytes === null)
+        return false;
+    return crypto.subtle.verify("HMAC", await hmacKey(secret), bytes, encoder.encode(text));
+}
+export function base64UrlJson(value) {
+    return toBase64Url(encoder.encode(JSON.stringify(value)));
+}

package/dist/form/index.d.ts

@@ -0,0 +1,7 @@
+export { InquiryForm } from "./inquiry-form.js";
+export type { InquiryFormProps } from "./inquiry-form.js";
+export type { InquiryContactRequirement, InquiryFormState } from "../inquiry/form-state.js";
+export { SiteChat } from "./site-chat.js";
+export { whatsappHref } from "../chat/whatsapp-href.js";
+export type { SiteChatProps } from "./site-chat.js";
+export type { SiteChatReply } from "../chat/chat-reply.js";

package/dist/form/index.js

@@ -0,0 +1,7 @@
+// @organizapp/site-kit/form
+//
+// Lo que corre en el navegador: el formulario, el chat y lo que comparten con su acción.
+// Nada de acá firma ni conoce un secreto; eso vive en la entrada principal.
+export { InquiryForm } from "./inquiry-form.js";
+export { SiteChat } from "./site-chat.js";
+export { whatsappHref } from "../chat/whatsapp-href.js";

package/dist/form/inquiry-form.d.ts

@@ -0,0 +1,23 @@
+import { type InquiryContactRequirement, type InquiryFormState } from "../inquiry/form-state.js";
+/**
+ * El formulario de consulta. Marcado semántico y sin estilos propios: el sitio
+ * lo viste con `className` y los `data-organizapp-*`. La acción es la Server
+ * Action del sitio, que llama a `handleInquiryForm`; acá no hay ningún secreto.
+ *
+ * El campo trampa va FUERA de la pantalla y no con `display:none`: un bot que
+ * lee el CSS saltea lo oculto, pero completa lo que existe. Fuera del tab y del
+ * árbol de accesibilidad, una persona no lo ve ni lo alcanza.
+ */
+export interface InquiryFormProps {
+    readonly action: (state: InquiryFormState, data: FormData) => Promise<InquiryFormState>;
+    /** `await createFormSeal(...)` en el Server Component de la página, por pedido. */
+    readonly seal: string;
+    readonly contact: InquiryContactRequirement;
+    readonly policyHref: string;
+    /** El nombre del negocio, que nombra el texto de novedades. La casilla arranca sin marcar. */
+    readonly businessName: string;
+    /** Prende el widget de Turnstile. Con esto, la acción necesita `turnstileSecret`. */
+    readonly turnstileSiteKey?: string;
+    readonly className?: string;
+}
+export declare function InquiryForm(props: InquiryFormProps): import("react").JSX.Element;

package/dist/form/inquiry-form.js

@@ -0,0 +1,43 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useActionState, useId } from "react";
+import { INQUIRY_FIELD } from "../inquiry/form-state.js";
+import { marketingOptInText } from "../inquiry/marketing-opt-in.js";
+const OFFSCREEN = { position: "absolute", left: "-10000px", width: "1px", height: "1px", overflow: "hidden" };
+const FIELD_ERRORS = {
+    name: "Escribí tu nombre (hasta 100 caracteres).",
+    phone: "Revisá el teléfono: con código de área, solo números.",
+    email: "Revisá el email.",
+    contact: "Dejanos un teléfono o un email para responderte.",
+    message: "Escribí tu consulta (hasta 2000 caracteres).",
+};
+function errorText(state) {
+    if (state.status === "invalid")
+        return FIELD_ERRORS[state.field] ?? "No pudimos enviar la consulta. Probá de nuevo en un rato.";
+    if (state.status === "reload")
+        return "El formulario venció. Recargá la página para enviar la consulta.";
+    if (state.status === "rate_limited")
+        return "Mandaste varias consultas seguidas. Probá de nuevo en unos minutos.";
+    if (state.status === "failed")
+        return "No pudimos enviar la consulta. Probá de nuevo en un rato.";
+    return null;
+}
+const CONTACT_HINT = {
+    either: "Dejanos un teléfono o un email.",
+    phone: "Necesitamos tu teléfono para responderte.",
+    email: "Necesitamos tu email para responderte.",
+    both: "Necesitamos tu teléfono y tu email.",
+};
+export function InquiryForm(props) {
+    const [state, formAction, pending] = useActionState(props.action, { status: "idle" });
+    const id = useId();
+    const error = errorText(state);
+    const invalid = (field) => (state.status === "invalid" && state.field === field
+        ? { "aria-invalid": true, "aria-describedby": `${id}-error` } : {});
+    if (state.status === "sent") {
+        return _jsx("p", { role: "status", "data-organizapp-sent": "", children: "\u00A1Gracias! Recibimos tu consulta y te vamos a responder pronto." });
+    }
+    const phoneRequired = props.contact === "phone" || props.contact === "both";
+    const emailRequired = props.contact === "email" || props.contact === "both";
+    return _jsxs("form", { action: formAction, className: props.className, "data-organizapp-inquiry-form": "", children: [_jsx("input", { type: "hidden", name: INQUIRY_FIELD.seal, value: props.seal }), _jsx("div", { "aria-hidden": "true", style: OFFSCREEN, children: _jsxs("label", { children: ["Tu sitio web", _jsx("input", { type: "text", name: INQUIRY_FIELD.honeypot, tabIndex: -1, autoComplete: "off", defaultValue: "" })] }) }), error === null ? null : _jsx("p", { id: `${id}-error`, role: "alert", "data-organizapp-error": "", children: error }), _jsx("label", { htmlFor: `${id}-name`, children: "Nombre" }), _jsx("input", { id: `${id}-name`, type: "text", name: INQUIRY_FIELD.name, required: true, maxLength: 100, autoComplete: "name", ...invalid("name") }), _jsx("p", { id: `${id}-contact`, "data-organizapp-hint": "", children: CONTACT_HINT[props.contact] }), _jsx("label", { htmlFor: `${id}-phone`, children: "Tel\u00E9fono" }), _jsx("input", { id: `${id}-phone`, type: "tel", name: INQUIRY_FIELD.phone, required: phoneRequired, autoComplete: "tel", "aria-describedby": `${id}-contact`, ...invalid("phone") }), _jsx("label", { htmlFor: `${id}-email`, children: "Email" }), _jsx("input", { id: `${id}-email`, type: "email", name: INQUIRY_FIELD.email, required: emailRequired, maxLength: 254, autoComplete: "email", "aria-describedby": `${id}-contact`, ...invalid("email") }), _jsx("label", { htmlFor: `${id}-message`, children: "Consulta" }), _jsx("textarea", { id: `${id}-message`, name: INQUIRY_FIELD.message, required: true, maxLength: 2000, rows: 5, ...invalid("message") }), _jsxs("label", { "data-organizapp-opt-in": "", children: [_jsx("input", { type: "checkbox", name: INQUIRY_FIELD.marketingOptIn }), marketingOptInText(props.businessName)] }), props.turnstileSiteKey === undefined ? null : _jsxs(_Fragment, { children: [_jsx("script", { src: "https://challenges.cloudflare.com/turnstile/v0/api.js", async: true, defer: true }), _jsx("div", { className: "cf-turnstile", "data-sitekey": props.turnstileSiteKey })] }), _jsxs("p", { "data-organizapp-policy": "", children: ["Al enviar acept\u00E1s la ", _jsx("a", { href: props.policyHref, children: "pol\u00EDtica de privacidad" }), "."] }), _jsx("button", { type: "submit", disabled: pending, children: pending ? "Enviando…" : "Enviar consulta" })] });
+}

package/dist/form/site-chat.d.ts

@@ -0,0 +1,29 @@
+import { type ReactNode } from "react";
+import type { SiteChatReply } from "../chat/chat-reply.js";
+/**
+ * El chat del Asistente en el sitio (W-4). Marcado semántico y sin estilos
+ * propios, como el formulario: el sitio lo viste con `className` y los
+ * `data-organizapp-*`.
+ *
+ * Los mensajes viven solo en el estado de React: nada va a `localStorage` ni a
+ * otra memoria del navegador. La conversación la guarda Organizapp por un día y
+ * la sesión viaja en una cookie `httpOnly` que pone la acción del servidor.
+ *
+ * Cuando el Asistente deriva, o el chat no está, se cierra la caja de texto y se
+ * muestra `handoff` (el `<InquiryForm>` del sitio) y, si hay número, el enlace a
+ * WhatsApp. No hay chat en vivo con una persona.
+ */
+export interface SiteChatProps {
+    /** La Server Action del sitio, que llama a `sendChatMessage` y guarda la cookie. */
+    readonly action: (input: {
+        readonly text: string;
+    }) => Promise<SiteChatReply>;
+    /** El nombre del Asistente, que nombra el botón: «Chateá con Sofía». */
+    readonly assistantName: string;
+    /** Lo que se ofrece al derivar: normalmente el formulario de consulta. */
+    readonly handoff: ReactNode;
+    /** El WhatsApp del negocio, en cualquier formato; `null` si no tiene. */
+    readonly whatsapp: string | null;
+    readonly className?: string;
+}
+export declare function SiteChat(props: SiteChatProps): import("react").JSX.Element;

package/dist/form/site-chat.js

@@ -0,0 +1,42 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId, useState } from "react";
+import { whatsappHref } from "../chat/whatsapp-href.js";
+const TEXT_MAX = 1000;
+const BUSY = "Escribiste muchos mensajes seguidos. Probá en unos minutos.";
+export function SiteChat(props) {
+    const id = useId();
+    const [open, setOpen] = useState(false);
+    const [lines, setLines] = useState([]);
+    const [draft, setDraft] = useState("");
+    const [pending, setPending] = useState(false);
+    const [notice, setNotice] = useState(null);
+    const [closed, setClosed] = useState(false);
+    const whatsapp = whatsappHref(props.whatsapp);
+    async function send(event) {
+        event.preventDefault();
+        const text = draft.trim();
+        if (text === "" || pending)
+            return;
+        setPending(true);
+        setNotice(null);
+        setLines((current) => [...current, { from: "contact", text }]);
+        setDraft("");
+        try {
+            const reply = await props.action({ text });
+            if (reply.kind === "answer")
+                setLines((current) => [...current, { from: "ai", text: reply.text }]);
+            else if (reply.kind === "busy")
+                setNotice(BUSY);
+            else
+                setClosed(true);
+        }
+        catch {
+            setClosed(true);
+        }
+        finally {
+            setPending(false);
+        }
+    }
+    return _jsxs("section", { className: props.className, "data-organizapp-chat": "", children: [_jsx("button", { type: "button", "aria-expanded": open, "aria-controls": `${id}-panel`, onClick: () => setOpen((value) => !value), children: open ? "Cerrar el chat" : `Chateá con ${props.assistantName}` }), _jsxs("div", { id: `${id}-panel`, hidden: !open, "data-organizapp-chat-panel": "", children: [_jsx("ol", { "aria-live": "polite", "data-organizapp-chat-log": "", children: lines.map((line, index) => _jsx("li", { "data-organizapp-from": line.from, children: line.text }, index)) }), notice === null ? null : _jsx("p", { role: "alert", "data-organizapp-error": "", children: notice }), closed ? _jsxs("div", { "data-organizapp-chat-handoff": "", children: [_jsx("p", { children: "Para seguir, dejanos tu consulta y te respondemos." }), props.handoff, whatsapp === null ? null : _jsx("p", { children: _jsx("a", { href: whatsapp, target: "_blank", rel: "noopener noreferrer", children: "Escribinos por WhatsApp" }) })] }) : _jsxs("form", { onSubmit: send, "data-organizapp-chat-form": "", children: [_jsx("label", { htmlFor: `${id}-text`, children: "Tu mensaje" }), _jsx("textarea", { id: `${id}-text`, value: draft, onChange: (event) => setDraft(event.target.value), required: true, maxLength: TEXT_MAX, rows: 2 }), _jsx("button", { type: "submit", disabled: pending, children: pending ? "Enviando…" : "Enviar" })] })] })] });
+}

package/dist/index.d.ts

@@ -1 +1,16 @@
-export {};
+export { createFormSeal } from "./inquiry/form-seal.js";
+export { handleInquiryForm } from "./inquiry/handle-inquiry-form.js";
+export type { InquiryFormOptions } from "./inquiry/handle-inquiry-form.js";
+export { MARKETING_OPT_IN_VERSION, marketingOptInText } from "./inquiry/marketing-opt-in.js";
+export { submitInquiry } from "./inquiry/submit-inquiry.js";
+export type { SubmitInquiryResult } from "./inquiry/submit-inquiry.js";
+export type { InquiryFields, SiteConnection } from "./inquiry/inquiry-fields.js";
+export { clientIpFromHeaders, revalidationFromEnv, siteConnectionFromEnv } from "./inquiry/site-environment.js";
+export type { InquiryFormState } from "./inquiry/form-state.js";
+export { getSiteProfile } from "./profile/get-site-profile.js";
+export type { SiteProfileResult } from "./profile/get-site-profile.js";
+export type { SiteProfile } from "./profile/site-profile.js";
+export { SITE_PROFILE_TAG, createRevalidateHandler } from "./profile/revalidate-handler.js";
+export type { RevalidationConnection } from "./profile/revalidate-handler.js";
+export { CHAT_COOKIE, CHAT_COOKIE_OPTIONS, sendChatMessage } from "./chat/send-chat-message.js";
+export type { ChatMessageResult } from "./chat/send-chat-message.js";