Bug: Input of type number is incrementing/decrementing on mouse scroll

[arunks5]

React version:

Steps To Reproduce

Hey, I'm using a input field of type number. When the input field is in focus and mouse scroll is done , the value changes. This is happening only in chrome/safari but not in Firefox.
So, i raised a bug in chromium. I also attached a reproducible example there.
They said it is a intended behavior describe in https://chromestatus.com/feature/6662647093133312 and we just need to use useCapture where the wheel event is attached. But , I can see the wheel event is attached by react in the root element automatically. So, how can I proceed here. Any suggestion would be much helpful.

1. Open https://mui.com/joy-ui/react-input/#inner-html-input
2. Click on the type number input field and do mouse scroll. The input value changes and also the page scrolls.
3. Inspect and see the wheel event attached to the __next div element and also to the body
4. Remove the wheel event and see the issue no longer exists

Link to code example:
https://mui.com/joy-ui/react-input/#inner-html-input

The current behavior

Cannot set useCapture parameter option to the events attached

The expected behavior

Need to set useCapture option to the events attached (or) remove wheel event from being attached