Show only specific dates and ability to show recurring dates

[sujit-baniya]

Feature Request: 1

It would be less code on developer's side to just show the specific dates and hiding others. Currently I could use hidden to hide all non-essential dates but that would get a lot date ranges to hide.
So a property like show: [2023-01-01] would be good to show only that date hiding other dates

Feature Request: 2

I could select recurring day per week or dates per month and every other dates would be hidden/disabled.
For e.g. Weekly Sun, Tue Wed would allow me to only show Sun Tue and Wed for every week

[gpbl]

Hi @sujit-baniya thanks for your suggestions1

It would be less code on developer's side to just show the specific dates and hiding others.

Curious to see your code. hidden can get a function too, so that you can actually negate the hidden prop:

// Suppose `daysToShow` is the array of the days you want to display:

<DayPicker hidden={ date => { return !daysToShow.includes(date); } } />

I could select recurring day per week or dates per month and every other dates would be hidden/disabled.
For e.g. Weekly Sun, Tue Wed would allow me to only show Sun Tue and Wed for every week

Same as above, you can use a function:

// Will hide all Sun for every week;

<DayPicker hidden={ date => { return date.getDay() === 0; } } />

[ashrafnazar]

Hi @gpbl - can you hide weekends? So on the calendar, the user will only be able to see Mon-Fri

[ashrafnazar]

I managed to do partially what I wanted using the prop, whilst rendering the weekend day columns. See screenshot attached (I don't want anything in the red rectangles to render)

[gpbl]

@ashrafnazar you can also remove them via CSS - would that work for you?

https://codesandbox.io/p/sandbox/react-day-picker-forked-sszl6j?file=%2Fsrc%2Fstyles.css

.rdp-head_cell:first-child,
.rdp-head_cell:last-child,
.rdp-cell:first-child,
.rdp-cell:last-child {
  display: none;
}

[ashrafnazar]

@gpbl - Thanks for the reply!

Would it be worthwhile, having a prop to handle this? Would be nice if no CSS is required and the HTML markup doesn't feature the table header at all. Am keen to hear what you think

[ashrafnazar]

If you would consider this, I'm happy to work on a PR - just need a little direction on what I should change, as I'm not really familiar with the repo