react-spectrum icon indicating copy to clipboard operation
react-spectrum copied to clipboard

[useRangeCalendar] Should interacting outside RangeCalendar cancel ongoing selection instead of fulfill it?

Open QzCurious opened this issue 1 year ago • 2 comments

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

QzCurious avatar Jan 17 '24 17:01 QzCurious

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

LFDanLu avatar Jan 19 '24 19:01 LFDanLu

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:

  1. Click on a CalendarCell if state.anchorDate is set
  2. End dragging on a CalendarCell if state.anchorDate is set
  3. Press enter or space on a focused CalendarCell if state.anchorDate is set

QzCurious avatar Jan 20 '24 04:01 QzCurious

Close this as https://github.com/adobe/react-spectrum/pull/5721#issuecomment-1970324782 is closed.

QzCurious avatar Feb 29 '24 17:02 QzCurious