Improvements
- You can now customize when Conform should validate and revalidate (#127)
function Example() {
const [form, { email, password }] = useForm({
// This is now deprecated in favor of the new configs
initialReport: 'onBlur',
// Define when Conform should start validation. Default `onSubmit`.
shouldValidate: 'onBlur',
// Define when Conform should revalidate again. Default `onInput`.
shouldRevalidate: 'onBlur',
});
}
- The useForm hook now accepts an optional ref object. If it is not provided, conform will fallback to its own ref object instead. (#122)
function Example() {
const ref = useRef<HTMLFormElement>(null);
const [form, { email, password }] = useForm({
ref,
});
// `form.ref / form.props.ref` will now be the same as `ref`
return (
<form {...form.props}>
{/* ... */}
</form>
);
}
- The field config now generates an additional
descriptionId
to support accessible input hint. (#126)
function Example() {
const [form, { email }] = useForm();
return (
<form {...form.props}>
<label htmlFor={email.id}>Email</label>
<input {...conform.input(email, { type: "email", description: true })} />
{/* If invalid, it will set the aria-describedby to "${errorId} ${descriptionId}" */}
<div id={email.descriptionId}>
Email hint
</div>
<div id={email.errorId}>
{email.error}
</div>
</form>
)
}
- The defaultValue and initialError is no longer cached to simplify form reset. (#130)
Full Changelog: v0.6.0...v0.6.1