date-picker icon indicating copy to clipboard operation
date-picker copied to clipboard

Ability to highlight dates within a date range

Open nickyblissAviva opened this issue 4 years ago • 5 comments

Is your feature request related to a problem? Please describe. When using the date-picker for a date range it would be useful if the range of dates that has/is being selected could be highlighted visually, providing the user feedback as to the range they have selected.

Describe the solution you'd like Additional class added to dates within a set range to enable highlighting of the dates within the range that has been selected by the user. Similar to https://pikaday.com/examples/date-range.html

Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.

Additional context Add any other context or screenshots about the feature request here.

nickyblissAviva avatar Jan 08 '21 10:01 nickyblissAviva

Was there any solution offered for this issue? I'd like to same functionality

ashleyfigure avatar May 31 '22 22:05 ashleyfigure

I would also love a solution for this

samuel-clara avatar Aug 02 '22 08:08 samuel-clara

It's possible to hook up two date pickers via min and max so they restrict available dates and provide a range selection.

This approach of using separate from and to date fields is likely a more accessible solution than trying to combine in one single date field/calendar.

See https://gel.westpacgroup.com.au/design-system/components/date-picker?b=WBC#date-range for reference

jonnystening avatar Aug 02 '22 09:08 jonnystening

Thank you for your answer. Is it a way to style the selected date range once selected from the two date pickers?

samuel-clara avatar Aug 02 '22 10:08 samuel-clara

Hey, I'm the original author of this project. I've made a spiritual successor to duet here. It's not a full date picker, just the calender components (there's a guide in the docs on how to create a full picker). It has full support for date ranges, as well as displaying multiple months at once https://github.com/WickyNilliams/cally

WickyNilliams avatar Apr 14 '24 17:04 WickyNilliams