[Bug]: DatePicker and DatePicker input are not clickable when loaded with React.lazy

[bkarolyi]

Package

carbon-components-react

Browser

Chrome

Package version

v10.52.0

React version

v.17.0.2

Description

When I import the DatePicker and DatePickerInput components with React.lazy, the date picker does not set up well.
Calendar does not appear when I click on the date input.
In addition when I tested I found that in some cases the initial date value that I add to the DatePickerInput component's value property does not appear in the input.

It seems that other carbon react form components work well with React lazy.

Additional info:
The example code from the codebox works well without React lazy:
https://codesandbox.io/s/carbon-react-datepicker-non-lazy-example-ldj4x

react-flatpickr works well with React lazy:
https://codesandbox.io/s/react-flatpickr-lazy-example-gvwmy

CodeSandbox example

https://codesandbox.io/s/carbon-react-datepicker-lazy-example-xr50d

Steps to reproduce

• import DatePicker and DatePickerInput components with React lazy. You can use react-lazily for lazy import. It can handle destructuring during import.
• Wrap the components in React.Suspense with any fallback property.

Code of Conduct

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

[joshblack]

Hi there @bkarolyi! 👋 Thanks for taking the time to fill out this issue and for the codesandboxes, they're incredibly helpful and appreciated!

We can recreate the issue on your codesandbox (after bumping the styles up to v10) and can see the calendar not showing up. We'll add this issue to our project board and try and prioritize it in a future sprint.