Can't disable specific years when using year picker

[mdoliv]

Describe the bug I'm trying to use two Datepickers to select years that will be used as a start and end date (if I'm not mistaken, there's no RangePicker functionality for years only), using the date format "yyyy" and showYearPicker. When I try to exclude certain years from the list of possible choices, by using either excludeDates, excludeDateIntervals or filterDates, nothing happens, the years don't show as disabled and sometimes the year selection bugs (I can't select a different year from the one that's already selected).

To Reproduce Steps to reproduce the behavior:

Using excludeDateIntervals:

// These dates come from my database, I only care about the year. They come as a number representing the year
const minDate = new Date(pubDateRange._min.yearPub || 1970, 0);
const maxDate = new Date(
  pubDateRange._max.yearPub || Date.prototype.getFullYear(),
  11
 );

const [startDate, setStartDate] = useState(minDate);
const [endDate, setEndDate] = useState(maxDate);

// .....

<DatePicker
  inputLabel="From"
  selected={startDate}
  onChange={(date: Date) => setStartDate(date)}
  dateFormat="yyyy"
  minDate={minDate}
  maxDate={maxDate}
  showYearPicker
  excludeDateIntervals={[
    {
      start: new Date(1981, 0),
      end: subDays(minDate, 1),
     },
  ]}
  disabled={allDatesChecked}
/>

Using excludeDates:

// These dates come from my database, I only care about the year. They come as a number representing the year
const minDate = new Date(pubDateRange._min.yearPub || 1970, 0);
const maxDate = new Date(
  pubDateRange._max.yearPub || Date.prototype.getFullYear(),
  11
 );

const [startDate, setStartDate] = useState(minDate);
const [endDate, setEndDate] = useState(maxDate);

// .....

<DatePicker
  inputLabel="From"
  selected={startDate}
  onChange={(date: Date) => setStartDate(date)}
  dateFormat="yyyy"
  minDate={minDate}
  maxDate={maxDate}
  showYearPicker
  excludeDates={[subDays(minDate, 1)]} {/* Only one date just to test */}
  disabled={allDatesChecked}
/>

Using filterDates:

// These dates come from my database, I only care about the year. They come as a number representing the year
const minDate = new Date(pubDateRange._min.yearPub || 1970, 0);
const maxDate = new Date(
  pubDateRange._max.yearPub || Date.prototype.getFullYear(),
  11
 );

const [startDate, setStartDate] = useState(minDate);
const [endDate, setEndDate] = useState(maxDate);

// .....

<DatePicker
  inputLabel="From"
  selected={startDate}
  onChange={(date: Date) => setStartDate(date)}
  dateFormat="yyyy"
  minDate={minDate}
  maxDate={maxDate}
  showYearPicker
  filterDates={(date) => date.getFullYear() !== 1985} {/* Only a specific year just to test */}
  disabled={allDatesChecked}
/>

Expected behavior The excluded years should be disabled.

Screenshots This is one example, showing excludeDateIntervals. https://imgur.com/a/FYGF92a

Desktop (please complete the following information):

• OS: ArchLinux
• Browser: Firefox Dev

[github-actions[bot]]

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 10 days.

[github-actions[bot]]

This issue was closed because it has been stalled for 10 days with no activity.