[Bug]: DatePicker Range has unintended behavior when selecting dates

[jackpronske]

Package

@carbon/react

Browser

Chrome

Package version

1.57.0

React version

16.14.0

Description

This bug is in 1.57.0, but not in any previous versions. (currently downgraded to >=1.56.0 and bug was not present)
When selecting first date in date range, calendar closes instead of staying open for user to pick second date in date range.
When selecting second date range, the first date range contains BOTH first and second dates in selection.
We're using calendar as controlled component, with onChange functions and value properties. Again, this has worked until the recent update in 1.57.0.

Reproduction/example

https://stackblitz.com/edit/github-sf1rjr?file=src%2FApp.jsx,src%2Fmain.jsx

Steps to reproduce

-click start date, select date (note that calendar closes, this is not correct calendar function)
-select end date
-user can see that start date contains string "05/13/2024 to 05/14/2024", which is not correct calendar function

Suggested Severity

Severity 2 = User cannot complete task, and/or no workaround within the user experience of a given component.

Application/PAL

No response

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate problems

[2nikhiltom]

Hi @jackpronske

I reviewed the stackblitz link you shared

Observations

• The calendar remains open until both the start and end dates are selected.
• The behavior of calendar to close once you've initially selected a start and end date and then proceed to change either of these dates. Feels like a bug

This bug is in 1.57.0, but not in any previous versions. (currently downgraded to >=1.56.0 and bug was not present)

• I have verified the functionality with 1.56.0 version as well , the behavior remain the same

[jackpronske]

Good morning.

My link apparently didn't save the correct reflection of the bug. I have recreated and here (hopefully) the correct link
https://stackblitz.com/edit/github-sf1rjr?file=src%2FApp.jsx