Package

@carbon/react

Browser

Chrome, Safari, Firefox

Package version

v1.67.0

React version

v18.2.0

Description

Resetting Datepicker range with calendar using value property doesn't work when assigning either an array of two emtpy strings ["", ""] or an empty string ""

Below are our observations on the issue to summarize,

1. If we use an empty array [], the end date is not getting reset
2. If we use empty string "", when manually enter dates instead of picking from calendar opens up the calendar on end date input upon resetting.
3. We tried using array of two empty strings ["", ""], this fixes the issue with manual input, however, it's causing another issue, which is end date pertaining to previously selected value immediately after selecting the start date without opening calendar.

Reproduction/example

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

Steps to reproduce

1. Select date range using calendar
2. Click on "Reset range" button
3. Dates would be reset
4. Now select "Start date" again through calendar
5. You observe "End date" would automatically appear from your previous selection even after you reset both dates

Suggested Severity

Severity 3 = User can complete task, and/or has a 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