coerceFormValue

The coerceFormValue function is part of Conform's future export. These APIs are experimental and may change in minor versions. Learn more

A helper that enhances the schema with extra preprocessing steps to strip empty values and coerce form values to the expected type. To customize the coercion behavior, use configureCoercion.

import { coerceFormValue } from '@conform-to/valibot/future';

const enhancedSchema = coerceFormValue(schema);

The following rules are applied by default:

1. If the value is an empty string / file, pass undefined to the schema
2. If the schema is v.number(), trim the value and cast it with the Number constructor
3. If the schema is v.boolean(), treat the value as true if it equals on (browser default value of a checkbox / radio button)
4. If the schema is v.date(), cast the value with the Date constructor
5. If the schema is v.bigint(), trim the value and cast it with the BigInt constructor

#Parameters

schema

The valibot schema to be enhanced.

#Example

import { coerceFormValue } from '@conform-to/valibot/future';
import { useForm } from '@conform-to/react/future';
import * as v from 'valibot';

const schema = coerceFormValue(
  v.object({
    ref: v.string(),
    date: v.date(),
    amount: v.number(),
    confirm: v.boolean(),
  }),
);

function Example() {
  const { form, fields } = useForm(schema, {
    // ...
  });

  // ...
}

#Tips

Default values

coerceFormValue will always strip empty values to undefined. If you need a default value, use optional() to define a fallback value that will be returned instead.

const schema = v.object({
  foo: v.optional(v.string()), // string | undefined
  bar: v.optional(v.string(), ''), // string
  baz: v.optional(v.nullable(v.string()), null), // string | null
});