Dropdown: Safari rendering issue with small fixed width

[KubaGorka]

Describe the bug

In Safari, when a small fixed width is applied to a dropdown, the scrollbar is not rendered correctly. The width of the dropdown is not big enough to render the content , causing the items with long labels inside the dropdown to be 'squished'. This only happens when there are enough items in the list and the scroll becomes necessary.
I suspect it has something to do with the way Safari handles the overflow auto option and the way it adds the scrollbar, as it's different than in other browsers.
Screenshot from chrome:

Screenshot from safari:

Reproducer

https://stackblitz.com/edit/fhik6h-wwhyzz?file=src%2FApp.jsx

System Information

System:
    OS: macOS 14.5
    CPU: (8) arm64 Apple M1 Pro
    Memory: 88.42 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.20.3 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.2.3 - /usr/local/bin/npm
    pnpm: 8.15.6 - /usr/local/bin/pnpm
  npmPackages:
    primereact: latest => 10.8.3 
    react: 18.3.1 => 18.3.1 
  Browsers:
    Chrome: 129.0.6668.70
    Safari: 17.5

Steps to reproduce the behavior

1. Set a small fixed width on a dropdown.
2. Add enough items so a scroll will appear.
3. Open the dropdown.

Expected behavior

Dropdown width should be bigger in safari when scrollbar is present.

[github-actions]

This issue has been automatically marked as stale. If this issue is still affecting you with the latest version, please leave any comment, and we will keep it open. We are sorry that we have not been able to prioritize it yet. If you have any new additional information, please include it with your comment!

[github-actions]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you for your understanding!