carbon-design-system / carbon

A design system built by IBM
https://www.carbondesignsystem.com
Apache License 2.0
7.8k stars 1.8k forks source link

[Bug]: DatePicker startValue is coming as a combination of both start and end dates #16734

Closed Geethkadali closed 2 months ago

Geethkadali commented 3 months ago

Package

@carbon/react

Browser

Chrome, Safari, Firefox, Edge

Package version

v1.57.0

React version

v18.3.1

Description

When passing value to the Datepicker then start value is showing a combination of both start and end date

image

If we remove value to Datepicker and select the dates using keyboard, with the keyboard interaction always the onChange function is getting triggered and not moving to the next elements. This is especially challenging when trying to select the dates using only a keyboard.

Reproduction/example

https://stackblitz.com/edit/github-pjo2fh?file=src%2FApp.jsx&preset=node=

Steps to reproduce

  1. If we pass value in Datepicker select the start and end dates, then startValue is coming as a combination of start and end date, with keyboard interaction it's going to the next element.
  2. If we remove value in Datepicker and select the dates with keyboard and pressing tab not going to the next element, after end date always onChange function is getting triggered.

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

marcinmotNB commented 3 months ago

There is also problem with clearing values in inputs - when you'll provide [null, null] array to DatePicker end date is not cleared.