tonysamperi / ngx-mat-timepicker

A true material timepicker
https://tonysamperi.github.io/ngx-mat-timepicker
MIT License
114 stars 25 forks source link

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

Closed Emilysta closed 9 months ago

Emilysta commented 9 months ago

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. image Ad 3. image Ad 4. image Ad 6. image

Desktop:

**Versions

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 commented 9 months ago

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

tonysamperi commented 9 months ago

@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