Partially filled TimeField can not be reset

[beckerei]

Provide a general summary of the issue here

When the TimeField (RAC or spectrum) is partially filled (e.g., only the hour value is set), the represented value of the field on the outside is null.

In case the field is not filled, but the other fills it partially, it can not be reset in any way - except by changing the components key.

There are a few cases where this behaviour has undesired effects:

1. A partially filled, but optional field in a form: There is no way to tell the user that they haven't filled the form to their desire
2. Resetting a field value while the user is still focusing the field is not possible as a key change would remove focus from the field. In our case, it's an inline edit in which the user can omit their previous (unsafe) input by hitting the escape key.

🤔 Expected Behavior?

Partially filled time fields can be reset even though the initial value was null.

😯 Current Behavior

It's impossible to reset partially filled time fields when the initial value was null.

💁 Possible Solution

Several solutions could fix or mitigate the issue.

1. TimeField always contains a valid value. Report 1:-- as 1 hour to the outside. So whenever a segment is filled, all other segments could default to 0. As long as the user focuses the field placeholders could be shown - only on blur, these could be converted to 0.
   So any user input would result in a value change - meaning a controlled TimeField could be reset by setting its value to null.

2. Expose an imperative handler which you could call reset() on that resets any internal state and calls onChange with null in case the value isn't null already.

I would prefer solution 1) as 2) would make the field different compared to others, exposing internals to its outside API.

🔦 Context

We have forms with TimeFields that are optional, but entering a partial value may lead the user to believe the input is filled. However, the reported value is null.

We also have inline editing in a table where users can submit changes via Enter or by blurring the field.
Change a value from 12:00 to 13:-- (by accident?) would delete the underlying value. The user may not understand why.
For the same case, we want to allow the user to revert any changes by pressing ESC. From --:-- to user input 9:-- represents no change, but via ESC we can't reset to the previous value as the field is technically still null. (As described above, the key can't be changed, as otherwise the user loses their focus.)

---

We have a local implementation of a DurationField that we mostly copied from the TimeField implementation. There, I tried to implement the solution approach with the imperative handler. This mostly works, but has a bug that manifests from useDateSegment where enteredKeys can't be cleared, and I don't want to copy the hook as well.
I mostly don't want to deviate from any RAC implementation to not lose upstream bug fixes and behaviour.

I'm looking for your take on the problem in hopes that would could come to terms with what would the desired behaviour. We are very open to contributing a solution.

🖥️ Steps to Reproduce

https://stackblitz.com/edit/xushpn2b?file=src%2FExample.tsx

Version

@react-spectrum/s2@1.0.0

What browsers are you seeing the problem on?

Other, Microsoft Edge, Safari, Chrome, Firefox

If other, please specify.

No response

What operating system are you using?

OSX 26.1

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[nwidynski]

Related #9296 (comment)