vue-datepicker
vue-datepicker copied to clipboard
Enhanced Custom Class Support for Datepicker Selections
Is your feature request related to a problem? Please describe. I would like to have the ability to add more custom classes to the datepicker for better differentiation in the following scenarios:
- When a single date is selected, apply a custom class to the selected date, distinguishing it from unselected dates.
- When a date range is selected, custom classes for the start date, end date, and the dates in between, to differentiate them from unselected dates.
- When a week range is selected, custom classes for the start week, end week, and the weeks in between, to set them apart from unselected weeks.
- Custom class for disabled dates
- Custom class for Today's date
Currently, via the UIOptions interface's calendarCell
property, we can only set the same class name for all cells irrespective of their state.
Describe the solution you'd like
Additional options to the UIOptions
object can be provided to accommodate the above request.
Describe alternatives you've considered
We currently have automated tests in place that use a combination of custom classes passed to UIOptions and existing library classes (prefixed with dp) to target the desired cells. Example: document.querySelector('.myapp-custom-cell-class.dp__range_start')
However, we believe that relying on the library's internal classes may not be a reliable long-term approach.