Year dropdown scroll position not working when either minDate / maxDate props is being specified

[wenxiangtoh]

Describe the bug The scroll position of the year dropdrown is not scrolled towards the currently selected year when either minDate / maxDate prop is being specified. The scroll position will always stay in the center.

To Reproduce Steps to reproduce the behavior:

Possible Scenario 1

1. Specify minDate prop value as minDate = {new Date(1950,1,1)}
2. Open Calendar
3. Select the year dropdown
4. To Observe the scroll position (Centered)
5. Select a year like example: 1970

Possible Scenario 2

1. Specify maxDate prop value as maxDate = {new Date(2022,1,1)}
2. Open Calendar
3. Select the year dropdown
4. To Observe the scroll position (Centered)
5. Select a year like 2000

Expected behavior Whenever the year dropdown is opened, the scroll position should be referencing the currently selected year

Screenshots If applicable, add screenshots to help explain your problem. When maxDate is being specified

When minDate is being specified

Desktop (please complete the following information):

• OS: [e.g. iOS]: iOS
• Browser [e.g. chrome, safari]: Google Chrome
• Version [e.g. 22]: 104.0.5112.101

Additional context Add any other context about the problem here.

[Muhiq146]

If you use this prop, than I think your issue will be solved.

dropdownMode="select"

It will reference the selected or current year.

[wenxiangtoh]

Hi, using the dropdownMode = 'select' does help to solve the scroll position issue but It seems not compatible with CSS style, making it display a large list instead of a manageable size list.

[kit52]

@wenxiangtoh Have you solved this problem?

[Muhiq146]

@wenxiangtoh Hi, yes it creates this issue and looks bad in UI because it is not taking prop yearDropdownItemNumber into consideration. But it will solve your referencing issue and as well as min & max date issue.

I will try to solve, if you have any solution please share.

[wenxiangtoh]

@kit52 Hi kit, no the issue has not been solved yet. Still trying to work on it. @Muhiq146 yes, I am still trying to see if there is a workaround for it while waiting for the developer for this component to get back.

[Muhiq146]

@kit52 Have you found the way to run this repository?

[kit52]

@kit52 Have you found the way to run this repository?

https://github.com/Hacker0x01/react-datepicker/blob/df2ac5c6d9a6f6d5298cc3de28f0f95dd8cd5d70/CONTRIBUTING.md but i am not run also

[Muhiq146]

@kit52 Thanks for sharing, I can run it properly. If you have any issue, tell me.

[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.