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

Customize page size for a calendar showing multiple months

Open Manduro opened this issue 2 years ago • 2 comments

🙋 Feature Request

I would like to have a calendar showing two months, that goes forward only one month when pressing the next button.

🤔 Expected Behavior

The behavior of previous/next buttons does not implicitly change when changing visibleDuration, but can be customized in a different way.

😯 Current Behavior

When using a calendar with a custom visibleDuration (for example 2 months), the behavior of the previous and next buttons also changes. Pressing next suddenly goes forward two months instead of one. This behavior is a bit implicit and not customizable.

💁 Possible Solution

Breaking change: The behavior of previous/next buttons DOES NOT change when changing visibleDuration. It can instead be customized using a new prop like pageSize of type Duration.

OR

Non-breaking change: The behavior of previous/next buttons DOES change when changing visibleDuration as is already the case. It can be customized using a new prop like pageSize of type Duration.

💻 Examples

https://airbnb.com has a calendar range picker when selecting a date. Clicking next only goed forward one month, not two.

Manduro avatar Jul 05 '22 17:07 Manduro

Thank you for filing this feature request, the team will have to discuss on the expected behavior, will bring this up in our next sprint grooming session.

LFDanLu avatar Jul 13 '22 20:07 LFDanLu

The team has discussed the above behavior and we've added it to our backlog. It may take us some time to get to this due to other priorities, but we'd be happy to accept any PRs for this!

LFDanLu avatar Aug 03 '22 20:08 LFDanLu