Added support for displaying (only) the year picker
Closes #55
The first commit adds a prop "showYearPicker" to the Datepicker which is just passed to the Calendar component, which just sets const [showYears, setShowYears] = useState(showYearPicker);. When a year is selected, the clickYear callback just sets the startDate and endDate to the first of January of the selected year.
The second commit adds a prop "yearPickerStartYearOffset" which offsets the years displayed in the year picker. For example if year is 2023 and yearPickerStartYearOffset = -10 the year picker now displays the years 2013-2024 instead of the default 2023-2034.
The third commit adds support for selecting a start- and end-year by moving the functionality which was in the "clickDay" callback to a separate helper function, and calls that helper function from the "clickYear" callback.
To use this, you just need to pass a couple of props to the Datepicker. This selects a range of years (a start year and an end year):
<Datepicker
displayFormat="YYYY"
showYearPicker={true}
yearPickerStartYearOffset={-5}
/>
This selects one single year:
<Datepicker
displayFormat="YYYY"
useRange={false}
asSingle={true}
showYearPicker={true}
yearPickerStartYearOffset={-5}
/>
Hi @ackelman 👋
Sorry for the delay
Thanks for this PR.
Hi @ackelman 👋
Sorry for the delay
Thanks for this PR.
Hi @onesine Can you please merge this and launch this feature?