如何限制MUI TimePicker手动输入仅允许整小时时间？

我基于Material UI定制了TimePicker，已实现点击时钟图标时只能选择整小时时间（如15:00、16:00等），但目前用户手动输入文本框时可输入任意有效时间（如14:34），不符合需求，求解决方案。

我的TimePicker代码如下：

<LocalizationProvider dateAdapter={AdapterDateFns} locale={locale}>
    <TimePicker
        ampm={false}
        openTo="hours"
        views={['hours']}
        inputFormat="HH:mm"
        mask="__:__"
        value={dayStartValue}
        InputAdornmentProps={{
            position: 'start',
        }}
        components={{
            OpenPickerIcon: ClockFilledIcon,
        }}
        onChange={(newValue) => {
            setDayStartValue(newValue)
        }}
        renderInput={(params) =>
            <TextField
                {...params}
                helperText="Input start of Day time"
            />
            
        }}
    />
</LocalizationProvider>

可以通过以下几种方式结合，实现手动输入时强制限制为整小时：

1. 在onChange中自动修正分钟为00 #

无论用户是通过选择器还是手动输入，都将时间的分钟、秒数和毫秒数强制设置为0，确保最终值是整小时：

onChange={(newValue) => {
    if (newValue) {
        const roundedTime = new Date(newValue);
        roundedTime.setMinutes(0, 0, 0);
        setDayStartValue(roundedTime);
    } else {
        setDayStartValue(newValue);
    }
}}

2. 固定输入掩码为整小时格式 #

将mask修改为__:00，让用户输入时只能修改小时部分，分钟固定显示为00，从输入层面限制非合规内容：

mask="__:00"

3. 为文本框添加失焦修正 #

在TextField中添加onBlur事件，当用户离开输入框时自动修正时间为整小时，避免用户通过粘贴等方式输入非整小时值：

renderInput={(params) =>
    <TextField
        {...params}
        helperText="Input start of Day time"
        onBlur={() => {
            if (dayStartValue) {
                const roundedTime = new Date(dayStartValue);
                roundedTime.setMinutes(0, 0, 0);
                setDayStartValue(roundedTime);
            }
        }}
    />
}

4. 添加输入验证（可选） #

通过TextField的inputProps添加正则验证，实时提示用户输入格式错误：

renderInput={(params) =>
    <TextField
        {...params}
        helperText="Input start of Day time"
        inputProps={{
            ...params.inputProps,
            pattern: "\\d{2}:00",
            title: "请输入整小时时间，格式为HH:00"
        }}
    />
}

内容的提问来源于stack exchange，提问作者Yana Trifonova