ScrollArea doesn't always reset blocking pointer events on body tag

[t-vince]

Dependencies check up

• I have verified that I use latest version of all @mantine/* packages

What version of @mantine/* packages do you have in package.json?

7.12.0

What package has an issue?

@mantine/core

What framework do you use?

Vite

In which browsers you can reproduce the issue?

Chrome

Describe the bug

In the ScrollArea component when scrolling, pointer-events are set to none and when scrolling stops this is reset back to auto.
This behavior happens since bd6fad3 with

onPointerDown={composeEventHandlers(props.onPointerUp, (event) => {
          [...]
          document.body.style.pointerEvents = 'none';

and gets reset with

onPointerUp={composeEventHandlers(props.onPointerUp, (event) => {
          [...]
          document.body.style.pointerEvents = 'auto';

However, this does not always work reliably. When clicking next to the scrollbar after scrolling, it can cause it to not reset the this pointer event, which makes it seem that the whole page freezes as it no longer takes pointer input. Only way to make the page function again is to remove the pointer-events: none; from the body tag or refreshing the page.

The last version where this is not reproducible is 7.10.1 (the version before the mentioned commit)
It is also reproducible on the mantine website, on the ScrollArea page

Screen.Recording.2024-08-16.at.15.58.56.mp4

If possible, include a link to a codesandbox with a minimal reproduction

No response

Possible fix

It seems that the pointerUp event is not always correctly triggered. I'd propose to just revert the pointer-events on body PR, make this optional so people can opt-out or scope it to the scrollArea instead of the body tag. Currently it's quite risky; when it fails, it disables the complete page and not just the ScrollArea component.

Self-service

• I would be willing to implement a fix for this issue

[rtivital]

Fixed in 7.12.2