internal: fix scrolling for high res devices

Implements first part of #202

modules/bar/Bar.qml

@@ -96,12 +96,12 @@ Item {
             implicitWidth: workspacesInner.implicitWidth + Appearance.padding.small * 2
             implicitHeight: workspacesInner.implicitHeight + Appearance.padding.small * 2
 
-            MouseArea {
+            CustomMouseArea {
                 anchors.fill: parent
                 anchors.leftMargin: -Config.border.thickness
                 anchors.rightMargin: -Config.border.thickness
 
-                onWheel: event => {
+                function onWheel(event: WheelEvent): void {
                     const activeWs = Hyprland.activeToplevel?.workspace?.name;
                     if (activeWs?.startsWith("special:"))
                         Hyprland.dispatch(`togglespecialworkspace ${activeWs.slice(8)}`);

modules/bar/components/ActiveWindow.qml

@@ -16,13 +16,13 @@ Item {
     implicitWidth: child.implicitWidth
     implicitHeight: child.implicitHeight
 
-    MouseArea {
+    CustomMouseArea {
         anchors.top: parent.top
         anchors.bottom: child.top
         anchors.left: parent.left
         anchors.right: parent.right
 
-        onWheel: event => {
+        function onWheel(event: WheelEvent): void {
             if (event.angleDelta.y > 0)
                 Audio.setVolume(Audio.volume + 0.1);
             else if (event.angleDelta.y < 0)
@@ -30,13 +30,13 @@ Item {
         }
     }
 
-    MouseArea {
+    CustomMouseArea {
         anchors.top: child.bottom
         anchors.bottom: parent.bottom
         anchors.left: parent.left
         anchors.right: parent.right
 
-        onWheel: event => {
+        function onWheel(event: WheelEvent): void {
             const monitor = root.monitor;
             if (event.angleDelta.y > 0)
                 monitor.setBrightness(monitor.brightness + 0.1);

modules/dashboard/Tabs.qml

@@ -103,7 +103,7 @@ Item {
 
         background: null
 
-        contentItem: MouseArea {
+        contentItem: CustomMouseArea {
             id: mouse
 
             implicitWidth: Math.max(icon.width, label.width)
@@ -123,7 +123,8 @@ Item {
 
                 rippleAnim.restart();
             }
-            onWheel: event => {
+
+            function onWheel(event: WheelEvent): void {
                 if (event.angleDelta.y < 0)
                     root.state.currentTab = Math.min(root.state.currentTab + 1, bar.count - 1);
                 else if (event.angleDelta.y > 0)

widgets/CustomMouseArea.qml

@@ -0,0 +1,21 @@
+import QtQuick
+
+MouseArea {
+    property int scrollAccumulatedY: 0
+
+    function onWheel(event: WheelEvent): void {
+    }
+
+    onWheel: event => {
+        // Update accumulated scroll
+        if (Math.sign(event.angleDelta.y) !== Math.sign(scrollAccumulatedY))
+            scrollAccumulatedY = 0;
+        scrollAccumulatedY += event.angleDelta.y;
+
+        // Trigger handler and reset if above threshold
+        if (Math.abs(scrollAccumulatedY) >= 120) {
+            onWheel(event);
+            scrollAccumulatedY = 0;
+        }
+    }
+}

widgets/StyledScrollBar.qml

@@ -21,10 +21,11 @@ ScrollBar {
         }
     }
 
-    MouseArea {
+    CustomMouseArea {
         z: -1
         anchors.fill: parent
-        onWheel: event => {
+
+        function onWheel(event: WheelEvent): void {
             if (event.angleDelta.y > 0)
                 root.decrease();
             else if (event.angleDelta.y < 0)