react-spectrum
react-spectrum copied to clipboard
[useRangeCalendar] Should interacting outside RangeCalendar cancel ongoing selection instead of fulfill it?
Provide your feedback here.
It's convert from discussions #5702
Just like clicking outside a dialog would effectively close it. So should RangeCalendar, for UX of my.
If it works as design, I would like to know why. Thanks.
https://github.com/adobe/react-spectrum/assets/38932402/9aa5b3d8-ddb0-491e-929f-e2f80ebfc4e0
The running code is an example from docs
And code of the behavior is here
https://github.com/adobe/react-spectrum/blob/4ae2831f9487958511c88b9ebe672b5650042d7e/packages/%40react-aria/calendar/src/useRangeCalendar.ts#L66-L71
BTW, I filed another discussion #5703 which might somehow related to this one.
🔦 Context
No response
💻 Code Sample
No response
Version
react-aria 3.31.0
What browsers are you seeing the problem on?
No response
If other, please specify
No response
What operating system are you using?
No response
I believe the intended intent of the "select range on blur" was to essentially save/commit the range selection that the user made up to that point, with the assumption that said blur was intentional. In a similar vein to the discussion in https://github.com/adobe/react-spectrum/issues/3738, perhaps we could enhance this behavior to ignore blur events that are triggered when interacting with stuff inside the calendar's modal if one exists. Might be a bit difficult for range calendars that aren't in a specific container of sorts, thinking if we should also let people disable this behavior via a prop
After reading #3738 and https://github.com/adobe/react-spectrum/issues/3738#issuecomment-1741041887, and with the behaviors I've listed out #5721. I would consider "select range on blur" not a right intent. Because we all try to bypass it. Or I'd say that the right intents to save/commit selection should only be explicitly:
- Click on a CalendarCell if
state.anchorDateis set - End dragging on a CalendarCell if
state.anchorDateis set - Press enter or space on a focused CalendarCell if
state.anchorDateis set
Close this as https://github.com/adobe/react-spectrum/pull/5721#issuecomment-1970324782 is closed.