adobe / react-spectrum

A collection of libraries and tools that help you build adaptive, accessible, and robust user experiences.
https://react-spectrum.adobe.com
Apache License 2.0
12.72k stars 1.09k forks source link

DateField could offer to cycle time beyond focused segment with arrow up/down #6590

Open vgrafe opened 3 months ago

vgrafe commented 3 months ago

Provide a general summary of the feature here

Using the up/down arrows while focused on a segment of a DateField component allows an user to increment/decrement whatever is selected. It would be great if, when pushing "up" while focusing on seconds, and at 59 seconds, in addition to setting the seconds to 00, the minutes would be incremented.

🤔 Expected Behavior?

When pushing "up" while focusing on seconds, and at 59 seconds, in addition to setting the seconds to 00, the minutes would be incremented (and so forth).

😯 Current Behavior

The focused segment is reset, most likely going against the user's intent.

💁 Possible Solution

Introduce a property acting as a flag to enable the new behavior, so breaking changes are prevented.

🔦 Context

I am working on an app that allows to navigate through data by selecting a date/time. using the arrows comes naturally to "replay" that data, but the current behavior does not allow to navigate by the second over another minute, or by the minute over the next hour etc.

💻 Examples

No response

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

LFDanLu commented 3 months ago

This feels like a valid use case to me, we do already have access to the segment's min and max in the increment and decrement methods, so theoretically we could implement the behavior you described so long as we batch together the increment/decrement of the adjacent segment along with changing the current segment to its min/max. Will ask the team if they have any opinions on this here.

yihuiliao commented 3 months ago

Hmm I’m not sure if this offers a better user experience. For example, if you’re focused on the minutes, would you expect changes to occur outside of the minutes? I think it could be confusing in the case you’re using VO changing the minutes when the hour suddenly changes.

That said, I do vaguely recall the old iOS timer behaving similar to this (I could be wrong but it feels familiar) so the behavior isn't entirely unheard of

vgrafe commented 3 months ago

Thanks for considering!! Regardless of seeing this feature land or not, I could (and maybe other users in the future) use some pointers on how to implement this with the current components. Is there no other way than forking useDateSegment.ts and dependent components?

LFDanLu commented 3 months ago

You may be able to chain together your own keydown/pointer handlers with what useDataSegment provides to provide the additional segment updates? I imagine there will be other issues that will occur that will result in needing to fork useDateSegment at the very least just so that you have finer control over the specific logic that happens in increment/decrement.

vgrafe commented 3 months ago

For example, if you’re focused on the minutes, would you expect changes to occur outside of the minutes? I think it could be confusing in the case you’re using VO changing the minutes when the hour suddenly changes.

@yihuiliao do you think the same argument could be made of the current behavior, that switches focus from a segment to the next one when typing values using a physical keyboard?

LFDanLu commented 3 months ago

@vgrafe Mind expanding on your exact use case? I assumed at first that this was manipulating duration (aka like in video editing as you are scrubbing through perhaps) but that would need to be a different thing entirely (would use the Intl.DurationFormat instead). The team still saw a use case for manipulating dates still though (browsing through logs or something), but Spectrum Design doesn't have a UX pattern that would use this yet so it is unlikely that we would pick this up in the short term unfortunately.

vgrafe commented 3 months ago

Got you, thanks for the extra context! I'll try to clarify my use case if that helps: I am implementing a webapp that provides a DateField and a canvas for timeseries dataviz. There is no scrubber or slider since any datetime can be set on the DateField, and on any change on that field, data is fetched and rendered in the canvas.

At first that was great, but it became natural to focus minutes or seconds then use the up/down arrows, providing a way to see data evolve in time, and this UX really works - except that, as you imagine, it is not possible to increment/decrement more than 59 times when focusing on seconds or minutes, without seeing the data jumping back in time.

I hope this makes the case for this behavior as a valid expectation, but am not insisting that this should prioritized; I can prob whip an quick and unfathomable hack to fix my use case. I appreciate your work and opinion on this!

snowystinger commented 3 months ago

We could consider a contribution for this. It'd have to be opt-in behavior though. Thanks for the extra information.