I am trying to block invalid date input by using the acceptRegex property in Datepicker but couldn't get it applied. I don't want the user to enter an invalid date like 3022-56-45 by keyboard input.I should be allowing the numbers which forms valid date only. Here is my current implementation.
<LocalizationProvider dateAdapter={AdapterDateFns}>
<DesktopDatePicker
label="Date of Birth"
inputFormat="yyyy-MM-dd"
acceptRegex="/^d{4}-d{2}-d{2}$/"
mask={"____-__-__"}
minDate="1900-01-01"
value={dateOfBirth ? parseISO(dateOfBirth) : null}
onChange={(val) => {
setDateOfBirth(moment(val).utc().format("YYYY-MM-DD"));
}}
renderInput={(params) => (
<TextField fullWidth sx={{ pr: 3 }} {...params} />
)}
/>
</LocalizationProvider>