[BUG] - Invalid DateTime appears in both inputs when cursor is moved to the beginning and user wants to enter specific values

[Emilysta]

Describe the bug
Assume a timepicker with [enableKeyboardInput]="true" set.
In the hour input, when cursor is moved to the beginning and current value of input is 00, 01 or 02 [for 24h picker] when someone tries to enter e.g. 1, input value changes to Invalid DateTime.
In the minutes input, when cursor is moved to the beginning and current value of input is 00, 01, 02, 03, 04, 05 when someone tries to enter e.g. 1, input value changes to Invalid DateTime.

To Reproduce

Steps to reproduce the behavior:

1. Click the input field to open the clicker
2. Select hours input in 12h mode
3. Enter e.g. 01
4. Move the cursor to the beginning of the input
5. Try to enter e.g. 1 by keyboard
6. The hours input field contains Invalid DateTime

Expected behavior
Block user input, as in the rest of cases (e.g. 04 for hours in 12h mode)

Screenshots
Ad 2.
Ad 3.
Ad 4.
Ad 6.

Desktop:

• OS: Windows
• Browser: Chrome, Firefox

**Versions

• ngx-mat-timepicker version 17.0.2 (but also appears on 17.0.3)
• @angular/core version 17.0.5
• @angular/material version 17.0.2
• typescript version 5.2.2

Additional context
Seems like for 12h picker and hours input the problem is with entering values: 1 and 2.
Seems like for 24h picker and hours input the problem is with entering values: 1,2 and 3.
Seems like for minutes input the problem is with entering values: 1-9.

[tonysamperi]

Hi @Emilysta thanks for reporting.
This is basically related to #58.
I'm closing this as a dupe.

[tonysamperi]

@Emilysta by the way if you could tell me how you think the input at the bottom behaves in this blitz, it would help.

https://stackblitz.com/edit/ts-angular-13-web-container-starter