@qaflo/forms-client 1.0.0 → 1.1.1

package/README.md

@@ -171,6 +171,7 @@ The whole form except its markup. Returns `formProps`, `fieldProps(name)`,
 | `honeypotName` | `website` | The service reads `website` or `honeypot`. |
 | `idPrefix` | `cf-` | Must match your `<label htmlFor>`. |
 | `onSuccess` | none | Called with the submitted values. |
+| `onError` | none | Called on every failed submit, including an unsolved captcha, with `(result, values)`. Use it when results are shown as toasts: two identical failures in a row leave `state` and `error` unchanged, so an effect watching them fires once and the second attempt looks like it did nothing. |
 
 Validation rules mirror `internal/api/validate.go`. **The server stays the
 authority** — this exists so nothing it would reject costs a round trip, because

package/form.d.ts

@@ -20,6 +20,11 @@ export interface ContactFormConfig {
    */
   exclude?: string[]
   onSuccess?: (values: Record<string, string>) => void
+  /** Called on every failed submit, including an unsolved captcha. */
+  onError?: (
+    result: { ok: false; status: number; message: string },
+    values: Record<string, string>,
+  ) => void
 }
 
 export interface ContactFormHandle {

package/form.js

@@ -96,6 +96,7 @@ export function useContactFormWith(widget, config = {}) {
     idPrefix = 'cf-',
     exclude = [],
     onSuccess,
+    onError,
   } = config
 
   const [state, setState] = useState(/** @type {'idle'|'sending'|'ok'|'error'} */ ('idle'))
@@ -155,6 +156,7 @@ export function useContactFormWith(widget, config = {}) {
       if (!widget.getToken()) {
         setState('error')
         setError(SECURITY_CHECK_PENDING)
+        if (onError) onError({ ok: false, status: 0, message: SECURITY_CHECK_PENDING }, values)
         return
       }
 
@@ -177,8 +179,13 @@ export function useContactFormWith(widget, config = {}) {
       }
       setState('error')
       setError(result.message)
+      // Called on EVERY failed submit, which is what a site reporting results
+      // as a toast needs: two identical failures in a row leave `state` and
+      // `error` unchanged, so an effect watching them fires once and the second
+      // attempt looks like it did nothing at all.
+      if (onError) onError(result, values)
     },
-    [fields, messages, compose, subject, honeypotName, idPrefix, exclude, onSuccess, widget, fieldOrder],
+    [fields, messages, compose, subject, honeypotName, idPrefix, exclude, onSuccess, onError, widget, fieldOrder],
   )
 
   const invalid = useCallback((name) => (showErrors ? errors[name] : undefined), [showErrors, errors])

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qaflo/forms-client",
-  "version": "1.0.0",
+  "version": "1.1.1",
   "description": "Client half of the shared qaflo contact-form service: transport, Turnstile lifecycle and visitor-facing status messages.",
   "license": "MIT",
   "type": "module",
@@ -22,7 +22,8 @@
     "./messages": {
       "types": "./messages.d.ts",
       "default": "./messages.js"
-    }
+    },
+    "./package.json": "./package.json"
   },
   "files": [
     "*.js",