v3.11.0

Form Intelligence

@jayoncode/form-intelligence

Declare the workflow. Keep the markup. Submit with confidence.

Headless form engine — validation, when() rules, drafts, wizards, and safe submit in one createForm(). Your UI binds to state; the library owns the workflow.

Get Started Open playground Try Draft Desk↗

Checkout: show fields when needed + keep a draft

import { createForm, when } from "@jayoncode/form-intelligence";

// Pain: enterprise fields, autosave, and submit guards
// usually mean 4 effects and a race on every keystroke.

createForm({
  target: "#checkout",
  schema: {
    plan: { required: true },
    seatCount: { required: true },
    companyName: { minLength: 2 },
    email: "email",
  },
  rules: [
    when("plan")
      .equals("enterprise")
      .show("seatCount", "companyName")
      .require("seatCount", "companyName"),
  ],
  workflow: {
    autosave: {
      enabled: true,
      debounceMs: 800,
      onSave: (values) => api.saveDraft(values),
    },
    draft: {
      enabled: true,
      storageKey: "checkout:draft",
    },
  },
  // Same store as form.subscribe() — fires once after create, then on every notify
  subscribe: (form) => {
    syncCheckoutChrome(form.state); // draft badge, plan label, …
  },
  async onSubmit(values) {
    await api.checkout(values); // isSubmitting + double-submit guard built in
  },
});

Read the overview

Why it stands out

Validation

Modes and schema adapters — you choose when fields validate.

Rules (when())

Show / hide / require without scattered useEffect copies.

Drafts & autosave

Survive refresh; debounce saves you own.

Submit safety

Built-in submitting state, duplicate-submit guard, cancel, and optional offline queue — not a payment SDK.

Keep your markup

Enhance a normal <form>, or bind() into React / Vue / your own inputs — same engine, not a form builder.