Date
The date preset formats the input as a date (DD/MM/YYYY). It ensures that the entered values form a valid date structure.
Raw Value
Display Value
import { useViraMask } from '@virastack/input-mask';
import { useForm } from 'react-hook-form';
const form = useForm();
const { date } = useViraMask({
form,
schema: { date: 'date' },
});
<input {...date} />Customize
You can customize the date format. The following example uses the US format (MM/DD/YYYY).
Raw Value
Display Value
import { useViraMask } from '@virastack/input-mask';
import { useForm } from 'react-hook-form';
const form = useForm();
const { date } = useViraMask({
form,
schema: {
date: {
preset: 'date',
dateFormat: 'MDY',
}
},
});
<input {...date} placeholder="MM/DD/YYYY" />For more details, see the Mask Options page.