[BUG] - Select component auto closes in flex layout

[h0wXD]

NextUI Version

2.2.5

Describe the bug

Select not opening on either desktop or mobile after having selected a value. This seems to only happen in a flex layout when anything is rendered next to the select.

Example code snippet but can also be found on repro repo in the file https://github.com/h0wXD/nextui-select-issue/blob/master/src/components/Footer.tsx#L20

<div className="bg-black w-[400px] pt-3 pb-3 flex flex-row gap-2">
  <div className="flex flex-col grow">
    <Select
      items={days}
      label="Select a Day"
      className="w-[100%]"
      selectedKeys={Day ? [Day.key + ''] : []}
      onChange={handleSelectionChange}
    >
      {(day) => <SelectItem key={day.key}>{day.label}</SelectItem>}
    </Select>
  </div>
  <span className="flex flex-col justify-center">
    test
  </span>
</div>
</div>

Your Example Website or App

https://github.com/h0wXD/nextui-select-issue/

Steps to Reproduce the Bug or Issue

1. yarn install
2. yarn dev
3. select any option in footer
4. scroll
5. select one of the lower options
6. select auto closes and scrolls down page, unable to change option

Expected behavior

Expected the dropdown to be able to open and select value

Screenshots or Videos

2024-08-31.12-19-55.mp4

Operating System Version

Windows, Android

Browser

Chrome

[linear]

ENG-1305 [BUG] - Select component auto closes in flex layout

[macci001]

I would like to work on this.

[wingkwong]

@macci001 assigned. suggest to check with other select issues / PRs first. I remember someone reported a similar issue.

[macci001]

Okay, #3571 seems very similar issue. Nobody is working on this as far as I can see from the issue page.