useLockBodyScroll does not work on IOS safari

[AkromDev]

What is the current behavior? On iOS, the body is still scrollable when overlay is opened even though useLockBodyScroll is used. It works fine in Desktops and android phones though.

Steps to reproduce

• Open your IOS safari
• Go to this live demo
• Click Open button to open the overlay and scroll inside that overlay to bottommost.
• Keep scrolling after reaching overlay bottom and notice body gets scrolled as well

I recorded the issue below.

Notes to take from video recording

• I opened overlay from bottommost open button. So the body conent should stay here when I come back from overlay.
• I was able to reach to the overlay bottom and click close button
• Despite body scroll lock, I was able to scroll body up after scrolling up overlay. As a result, I was seeing topmost body content instead of bottommost where I opened overlay.

What is the expected behavior? Only overlay should be scrollable while body scroll should be locked just like in desktop and android browsers

A little about versions:

• OS: IOS 15.1
• Browser (vendor and version): safari 15.1
• React: ^18.2.0
• use-hooks:^18.2.0

View source code here