[Bug]: Datepicker issue with Keyboard Navigation

[Geethkadali]

Package

@carbon/react

Browser

Chrome, Safari, Firefox, Edge

Package version

v1.62.0

React version

v18.3.1

Description

With keyboard navigation able to select dates but the focus is not going to the next elements , the focus is always trapping inside date picker end date

Reproduction/example

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

Steps to reproduce

Select the dates using keyboard after selection of end date press tab doesn't work (focus not going to the next element).

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

[guidari]

The issue only happens if there is a setState inside the onChange. You can check the examples below:

Carbon example: https://stackblitz.com/edit/github-zwyeoc?file=src%2FApp.jsx
Flatpickr example: https://stackblitz.com/edit/react-flatpickr-example-not-working-zfkd25?file=src%2FApp.js

I guess this might be an issue on the Flatpickr library.