An absolute element inside the grid header cannot extend outside the grid.

[jooyoni]

Describe the bug

I used the renderHeaderCell method in the columns props to add an element inside the grid header. This element contains a filter button (yellow area in the picture), and clicking this button opens the blue area shown in the picture. However, the blue area cannot extend outside the overall grid area. I tried setting overflow: visible on the .rdg class, but it doesn't work.

To Reproduce

1. Use the renderHeaderCell method in the array for the columns props to input an element into the header.

2. Add a button to the header element added in step 1, and when this button is clicked, an element with the position: absolute property is rendered inside the header.

3. Ensure that the element rendered in step 2 is not clipped even if it extends outside the grid area.

Link to code example:

Expected behavior

Environment

• react-data-grid version:^7.0.0-beta.44
• react/react-dom version:^18.2.0

Additional context