React: field.error always true before validation

[bnk17]

Hi 👋 First, thank you for this library — the API and documentation are super clear, and it was really easy to get started. I'm using the React version.

I noticed something I don’t quite understand: in my field render, field.error seems to be always truthy, so the input immediately gets a red border, while the actual error message only shows after submitting the form.

Here’s a minimal snippet:

{(field, props) => (
  <>
    <label htmlFor="email">Email</label>
    <input
      {...props}
      id="email"
      type="email"
      placeholder="you@example.com"
      aria-invalid={!!field.error}
      aria-errormessage="email-error"
      className={`rounded p-2 border w-full ${
        field.error ? 'border-red-600' : 'border-gray-300'
      }`}
    />
    {field.error && (
      <div id="email-error" className="text-sm text-red-600">
        {field.error}
      </div>
    )}
  </>
)}

Expected: border + error message only show when validation fails (e.g., after submit).
Actual: border is red immediately because field.error is truthy, but the message only appears after submit.

Is this intended, or am I misusing field.error in the React version?