Prevent multiselect/dropdown box from closing on page scroll

[kslb30]

Describe the bug

When using the multiselect or dropdown component, when you open the select box and scroll vertically on the page, the select box closes automatically, and there's no way to keep it open.
The most frustrating part is that in the documentation, the select box remain open even if you scroll on the page, but in practice, it's impossible to keep them open...

Reproducer

https://c3tk48.sse.codesandbox.io/

PrimeReact version

10.3.1

React version

18.x

Language

TypeScript

Build / Runtime

Create React App (CRA)

Browser(s)

No response

Steps to reproduce the behavior

1. Go https://c3tk48.sse.codesandbox.io/
2. Open the select box
3. Reduce the window and display the console to have a vertical scroll
4. Scroll on the page will close automatically the select box

Expected behavior

Do not close automatically the select box when scrolling on the page or add an option to manage it (Dropdown and MultiSelect components)

[melloware]

It works fine try mine: https://stackblitz.com/edit/rhacf7?file=src%2FApp.tsx,src%2Findex.css

Key is your body CSS has to overflow:

body {
  margin: 0px;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  background-color: var(--surface-ground);
  font-weight: normal;
  color: var(--text-color);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[ScrKiddie]

It works fine try mine: https://stackblitz.com/edit/rhacf7?file=src%2FApp.tsx,src%2Findex.css

Key is your body CSS has to overflow:

body {
  margin: 0px;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  background-color: var(--surface-ground);
  font-weight: normal;
  color: var(--text-color);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

It's working perfectly when the dropdown is outside the dialog. How can I fix the dropdown inside the dialog without setting the dialog height to 100%?

[melloware]

Inside the dialog you need to use the appendTo property: https://primereact.org/dropdown/#api.Dropdown.props.appendTo

[antman888]

Inside the dialog you need to use the appendTo property: https://primereact.org/dropdown/#api.Dropdown.props.appendTo

What should it be appended to? Here's an example in a dialog with a TreeSelect that closes the menu on scroll:
https://stackblitz.com/edit/rhacf7-qrr9xf?file=src%2FApp.tsx