@doany-ai/forms 0.1.0-alpha.0 → 0.1.0-alpha.1

package/dist/components/form.js

@@ -7,6 +7,7 @@ import { Label } from "@doany-ai/app-core/ui/label";
 import { Skeleton } from "@doany-ai/app-core/ui/skeleton";
 import { Textarea } from "@doany-ai/app-core/ui/textarea";
 import { CheckCircle2, Loader2 } from "lucide-react";
+import { isE164, normalizePhone } from "../phone.js";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { useForm, useSubmitForm } from "../hooks.js";
 import { formLabels } from "../labels.js";
@@ -80,7 +81,14 @@ function Question({ field, value, onChange, labels }) {
     }
     const inputType = field.type === "email" ? "email" : field.type === "phone" ? "tel" : field.type === "number" ? "number" : field.type === "date" ? "date" : "text";
     const autoComplete = field.type === "email" ? "email" : field.type === "phone" ? "tel" : undefined;
-    return (_jsxs("div", { className: "space-y-2", children: [label, help, _jsx(Input, { id: id, type: inputType, autoComplete: autoComplete, value: typeof value === "number" ? String(value) : text, onChange: (e) => onChange(field.type === "number" ? (e.target.value === "" ? "" : Number(e.target.value)) : e.target.value), required: field.required, minLength: field.validation?.min_length, maxLength: field.validation?.max_length, min: field.validation?.min, max: field.validation?.max, className: fieldClass })] }));
+    return (_jsxs("div", { className: "space-y-2", children: [label, help, _jsx(Input, { id: id, type: inputType, autoComplete: autoComplete, value: typeof value === "number" ? String(value) : text, onChange: (e) => {
+                    if (field.type === "phone") {
+                        // The platform takes E.164 only: say so before the submit does.
+                        const normalized = normalizePhone(e.target.value);
+                        e.target.setCustomValidity(!normalized || isE164(normalized) ? "" : labels.phoneFormat);
+                    }
+                    onChange(field.type === "number" ? (e.target.value === "" ? "" : Number(e.target.value)) : e.target.value);
+                }, required: field.required, minLength: field.validation?.min_length, maxLength: field.validation?.max_length, min: field.validation?.min, max: field.validation?.max, className: fieldClass })] }));
 }
 /** The answers the platform takes: `hidden` values as given, numbers as numbers, nothing for blanks. */
 function answersOf(view, answers) {
@@ -88,14 +96,16 @@ function answersOf(view, answers) {
     for (const field of view.definition.fields) {
         if (field.type === "statement")
             continue;
-        if (field.type === "consent" && field.consent?.mode === "on_submit") {
-            out[field.key] = true;
+        // The backend writes an on-submit consent itself and refuses a value for it.
+        if (field.type === "consent" && field.consent?.mode === "on_submit")
             continue;
-        }
         const value = answers[field.key];
         if (value === undefined || value === "" || value === null)
             continue;
-        out[field.key] = value;
+        // Every option cleared again is no answer: the platform refuses an empty list.
+        if (Array.isArray(value) && value.length === 0)
+            continue;
+        out[field.key] = field.type === "phone" && typeof value === "string" ? normalizePhone(value) : value;
     }
     return out;
 }

package/dist/labels.d.ts

@@ -32,6 +32,8 @@ export interface FormLabels {
     choose: string;
     /** Beside a required question. */
     required: string;
+    /** Shown while a phone number is not in the international format. */
+    phoneFormat: string;
 }
 export declare const defaultFormLabels: FormLabels;
 /** The defaults with a site's changes on top. */

package/dist/labels.js

@@ -16,6 +16,7 @@ export const defaultFormLabels = {
     stepOf: (step, of) => `Step ${step} of ${of}`,
     choose: "Choose…",
     required: "required",
+    phoneFormat: "Use the international format, like +1 415 555 0132.",
 };
 /** The defaults with a site's changes on top. */
 export const formLabels = (labels) => (labels ? { ...defaultFormLabels, ...labels } : defaultFormLabels);

package/dist/phone.d.ts

@@ -0,0 +1,4 @@
+/** The platform takes phone numbers in E.164 (`+14155550132`): the visitor's
+ * spaces, dots, dashes and brackets are dropped and a `00` prefix becomes `+`. */
+export declare function normalizePhone(raw: string): string;
+export declare const isE164: (value: string) => boolean;

package/dist/phone.js

@@ -0,0 +1,7 @@
+/** The platform takes phone numbers in E.164 (`+14155550132`): the visitor's
+ * spaces, dots, dashes and brackets are dropped and a `00` prefix becomes `+`. */
+export function normalizePhone(raw) {
+    const trimmed = raw.trim().replace(/[\s().-]/g, "");
+    return trimmed.startsWith("00") ? `+${trimmed.slice(2)}` : trimmed;
+}
+export const isE164 = (value) => /^\+[1-9][0-9]{1,14}$/.test(value);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@doany-ai/forms",
-  "version": "0.1.0-alpha.0",
+  "version": "0.1.0-alpha.1",
   "description": "The business's forms on a Doany site: a form hook and a default component that renders a form's questions and submits the answers",
   "type": "module",
   "sideEffects": false,