Provide a way to add custom classes to the popover root component

[sage-syfre]

Description

When Carbon components with a popover (like DateInput,DateRange,Select...) are used in an AgGrid column filter they are displayed inside an AGGrid popup

When the use interacts with the Carbon component by clicking in the popover, AGGrid closes its popup because it recognizes the click as an "outside" click event.

To manage that AGGrid provides a custom class "ag-custom-component-popup" that the user can add to its own popup root element.

With the DateInput component it's possible to add this class to the DayPicker using the pickerProps, but unfortunatly the pickerProps are not passed to the DayPicker in DateRange component. (bug?)

With the Select component there is no simple way to add this class.

Suggested solution

A quick and dirty way is to add the "ag-custom-component-popup" to the popover root element

Demo URL

No response

Alternatives

No response

Additional context

No response

Confidentiality

• I confirm there is no confidential or commercially sensitive information included.

[Parsium]

Hi @sage-syfre 👋🏼 Would you be able to reproduce a small example using our starter template please?

We are hesitant about reintroducing className as a prop for our components, as it could lead to consumers overriding our CSS styles. This was a major challenge in the past and introduced maintenance difficulties.

That said, if this is a major blocker, we can explore alternative solutions to fix the underlying issue.