Fluentui: Calendar component range select

[bengcooper]

It would be nice if you could select a date range with the component by selecting the start date then the end date (this could be optionally only enabled when the user is holding down the shift key).

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions to Fabric React!

[michaelangotti]

This sounds like a reasonable ask. @betrue-final-final What do you think?

[lorejoh12]

We evaluated this feature and while it's a great use case, this is low on our backlog. But we would definitely love to do a code review for anyone willing to submit a PR for this!

Some initial thoughts on it- We currently have a dateRangeType parameter, which is what limits you to certain sizes of date ranges for ease of simplicity for the consumer. Allowing for custom ranges would effectively be adding an additional DateRangeType, which would then allow the outputted date range to specify an arbitrary start and end date.

For most cases where this type of arbitrary range is required, I've seen two separate date pickers used- one for the start, and a second for the end, but it's an interesting idea to allow them to be combined assuming both days you want selected can be visible at the same time (hard when the range is between two different months, would need to somehow allow for moving the current month forward while still in the "select range" mode.

[stale[bot]]

This issue has been automatically marked as stale because it has not activity for 60 days. It will be closed if no further activity occurs within 14 days of this comment. Thank you for your contributions to Fabric React!
Why am I receiving this notification?

[bmckilligan]

I think the best implementation of this is the 'Timeline' component available for pivot tables in Microsoft excel.

The web version of Excel has support for this feature, and it would be great to have this.

The control appears to be called 'timeSlicer' , guessing by the css classnames used in the sub components, 'ewr-timeslicer-background', 'ctl00_m_timeSlicerContainer' ect ...

An example of a simpler version of this http://ghusse.github.io/jQRangeSlider/demo.html

which brings up a different but related feature request, a range slider control for regular numeric values,

from the documentation on https://developer.microsoft.com/en-us/fabric#/components/slider , it looks like the sliders are for returning single values

[juliehubs]

I'll add that adding in time range as well would be awesome!

Thanks for all your hard work!

[assafsun]

is this issue still open for PR?

[JustSlone]

@lorejoh12, are we still interested in taking a PR for this feature? Any pending changes to Calendar that would affect this feature?