HoverableListItem: add tapped signal, remove inline TapHandlers

shell/applets/BatteryApplet.qml

@@ -201,13 +201,7 @@ Column {
         }
     }
 
-    // Separator
+    Separator {}
-    Rectangle {
-        width: parent.width - 16
-        height: 1
-        anchors.horizontalCenter: parent.horizontalCenter
-        color: S.Theme.base03
-    }
 
     // Rate row
     InfoRow {

shell/applets/BluetoothApplet.qml

@@ -9,24 +9,13 @@ Column {
     Repeater {
         model: S.BluetoothService.devices
 
-        delegate: Item {
+        delegate: HoverableListItem {
             id: entry
             required property var modelData
             required property int index
 
             readonly property bool _pending: S.BluetoothService.pendingMac === entry.modelData.mac
 
-            width: root.width
-            height: 32
-
-            Rectangle {
-                anchors.fill: parent
-                anchors.leftMargin: 4
-                anchors.rightMargin: 4
-                color: entryHover.hovered ? S.Theme.base02 : "transparent"
-                radius: S.Theme.radius
-            }
-
             Text {
                 id: btIcon
                 anchors.left: parent.left
@@ -83,15 +72,9 @@ Column {
                     entry.opacity = 1
             }
 
-            HoverHandler {
+            onTapped: {
-                id: entryHover
+                if (!entry._pending)
-                cursorShape: Qt.PointingHandCursor
+                    S.BluetoothService.toggleDevice(entry.modelData.mac, !entry.modelData.connected);
-            }
-            TapHandler {
-                onTapped: {
-                    if (!entry._pending)
-                        S.BluetoothService.toggleDevice(entry.modelData.mac, !entry.modelData.connected);
-                }
             }
         }
     }

shell/applets/CpuApplet.qml

@@ -149,13 +149,7 @@ Column {
         }
     }
 
-    // Process list separator
+    Separator {}
-    Rectangle {
-        width: root.width - 16
-        height: 1
-        anchors.horizontalCenter: parent.horizontalCenter
-        color: S.Theme.base03
-    }
 
     Item {
         width: root.width

shell/applets/GpuApplet.qml

@@ -113,12 +113,7 @@ Column {
     }
 
     // VRAM section
-    Rectangle {
+    Separator {}
-        width: parent.width - 16
-        height: 1
-        anchors.horizontalCenter: parent.horizontalCenter
-        color: S.Theme.base03
-    }
 
     Item {
         width: parent.width

shell/applets/HoverableListItem.qml

@@ -0,0 +1,30 @@
+import QtQuick
+import "../services" as S
+
+Item {
+    id: root
+
+    readonly property bool hovered: _hover.hovered
+    signal tapped
+
+    width: parent?.width ?? 0
+    height: 32
+
+    Rectangle {
+        anchors.fill: parent
+        anchors.leftMargin: 4
+        anchors.rightMargin: 4
+        color: root.hovered ? S.Theme.base02 : "transparent"
+        radius: S.Theme.radius
+        z: -1
+    }
+
+    HoverHandler {
+        id: _hover
+        cursorShape: Qt.PointingHandCursor
+    }
+
+    TapHandler {
+        onTapped: root.tapped()
+    }
+}

shell/applets/MemoryApplet.qml

@@ -115,13 +115,7 @@ Column {
     InfoRow { label: "Available"; value: root._fmt(root.availGb) }
     InfoRow { label: "Total"; value: root._fmt(root.totalGb) }
 
-    // Process list separator
+    Separator {}
-    Rectangle {
-        width: root.width - 16
-        height: 1
-        anchors.horizontalCenter: parent.horizontalCenter
-        color: S.Theme.base03
-    }
 
     Item {
         width: root.width

shell/applets/NetworkApplet.qml

@@ -9,22 +9,11 @@ Column {
     Repeater {
         model: S.NetworkService.networks
 
-        delegate: Item {
+        delegate: HoverableListItem {
             id: entry
             required property var modelData
             required property int index
 
-            width: root.width
-            height: 32
-
-            Rectangle {
-                anchors.fill: parent
-                anchors.leftMargin: 4
-                anchors.rightMargin: 4
-                color: entryHover.hovered ? S.Theme.base02 : "transparent"
-                radius: S.Theme.radius
-            }
-
             Text {
                 id: netIcon
                 anchors.left: parent.left
@@ -62,17 +51,11 @@ Column {
                 width: entry.modelData.signal >= 0 ? implicitWidth : 0
             }
 
-            HoverHandler {
+            onTapped: {
-                id: entryHover
+                if (entry.modelData.active)
-                cursorShape: Qt.PointingHandCursor
+                    S.NetworkService.disconnectNetwork(entry.modelData.uuid);
-            }
+                else
-            TapHandler {
+                    S.NetworkService.connectNetwork(entry.modelData.uuid);
-                onTapped: {
-                    if (entry.modelData.active)
-                        S.NetworkService.disconnectNetwork(entry.modelData.uuid);
-                    else
-                        S.NetworkService.connectNetwork(entry.modelData.uuid);
-                }
             }
         }
     }

shell/applets/Separator.qml

@@ -0,0 +1,9 @@
+import QtQuick
+import "../services" as S
+
+Rectangle {
+    width: (parent?.width ?? 16) - 16
+    height: 1
+    anchors.horizontalCenter: parent?.horizontalCenter
+    color: S.Theme.base03
+}

shell/applets/TemperatureApplet.qml

@@ -200,11 +200,7 @@ Column {
     }
 
     // Per-device breakdown
-    Rectangle {
+    Separator {
-        width: root.width - 16
-        height: 1
-        anchors.horizontalCenter: parent.horizontalCenter
-        color: S.Theme.base03
         visible: root.devices.length > 0
     }
 

shell/applets/VolumeApplet.qml

@@ -105,12 +105,7 @@ Column {
             visible: root.sinkList.length > 1
             width: parent.width
 
-            Rectangle {
+            Separator {}
-                width: parent.width - 16
-                height: 1
-                anchors.horizontalCenter: parent.horizontalCenter
-                color: S.Theme.base03
-            }
 
             Text {
                 width: parent.width
@@ -126,22 +121,13 @@ Column {
             Repeater {
                 model: root.sinkList
 
-                delegate: Item {
+                delegate: HoverableListItem {
                     required property var modelData
 
-                    width: root.width
                     height: 28
 
                     readonly property bool _active: modelData === root.sink
 
-                    Rectangle {
-                        anchors.fill: parent
-                        anchors.leftMargin: 4
-                        anchors.rightMargin: 4
-                        color: deviceHover.hovered ? S.Theme.base02 : "transparent"
-                        radius: S.Theme.radius
-                    }
-
                     Text {
                         anchors.left: parent.left
                         anchors.leftMargin: 12
@@ -156,25 +142,14 @@ Column {
                         elide: Text.ElideRight
                     }
 
-                    HoverHandler {
+                    onTapped: Pipewire.preferredDefaultAudioSink = modelData
-                        id: deviceHover
-                        cursorShape: Qt.PointingHandCursor
-                    }
-
-                    TapHandler {
-                        onTapped: Pipewire.preferredDefaultAudioSink = modelData
-                    }
                 }
             }
         }
 
         // Streams section
-        Rectangle {
+        Separator {
             visible: root.streamList.length > 0
-            width: parent.width - 16
-            height: visible ? 1 : 0
-            anchors.horizontalCenter: parent.horizontalCenter
-            color: S.Theme.base03
         }
 
         Text {

shell/applets/qmldir

@@ -7,10 +7,12 @@ CpuApplet 1.0 CpuApplet.qml
 DiskApplet 1.0 DiskApplet.qml
 GpuApplet 1.0 GpuApplet.qml
 HexWaveBackground 1.0 HexWaveBackground.qml
+HoverableListItem 1.0 HoverableListItem.qml
 InfoRow 1.0 InfoRow.qml
 MemoryApplet 1.0 MemoryApplet.qml
 MprisApplet 1.0 MprisApplet.qml
 NetworkApplet 1.0 NetworkApplet.qml
+Separator 1.0 Separator.qml
 NotifApplet 1.0 NotifApplet.qml
 TemperatureApplet 1.0 TemperatureApplet.qml
 VolumeApplet 1.0 VolumeApplet.qml

shell/modules/BacklightModule.qml

@@ -4,17 +4,15 @@ import "." as M
 import "../services" as S
 import "../applets" as C
 
-M.BarSection {
+M.OsdSection {
     id: root
     spacing: S.Theme.moduleSpacing
     opacity: S.Modules.backlight.enable && S.BacklightService.available ? 1 : 0
     visible: opacity > 0
-    tooltip: ""
+    _panelHovered: hoverPanel.panelHovered
 
     property int percent: S.BacklightService.percent
-    property bool _osdActive: false
     property bool _percentInit: false
-    readonly property bool _showPanel: root._hovered || hoverPanel.panelHovered || _osdActive
 
     onPercentChanged: {
         if (!_percentInit) {
@@ -22,18 +20,7 @@ M.BarSection {
             return;
         }
         if (percent > 0)
-            _flashPanel();
+            flashPanel();
-    }
-
-    function _flashPanel() {
-        _osdActive = true;
-        _osdTimer.restart();
-    }
-
-    Timer {
-        id: _osdTimer
-        interval: 1500
-        onTriggered: root._osdActive = false
     }
 
     WheelHandler {

shell/modules/OsdSection.qml

@@ -0,0 +1,25 @@
+import QtQuick
+
+// Base component for bar modules with OSD flash behavior (Volume, Backlight).
+// Panel shows on hover or when flashPanel() is called, auto-dismisses after 1.5s.
+// Modules bind _panelHovered to their HoverPanel's panelHovered property.
+BarSection {
+    id: root
+    tooltip: ""
+
+    property bool _panelHovered: false
+    property bool _osdActive: false
+    readonly property bool _anyHover: root._hovered || _panelHovered
+    readonly property bool _showPanel: _anyHover || _osdActive
+
+    function flashPanel() {
+        _osdActive = true;
+        _osdTimer.restart();
+    }
+
+    Timer {
+        id: _osdTimer
+        interval: 1500
+        onTriggered: root._osdActive = false
+    }
+}

shell/modules/VolumeModule.qml

@@ -5,10 +5,10 @@ import "." as M
 import "../services" as S
 import "../applets" as C
 
-M.BarSection {
+M.OsdSection {
     id: root
     spacing: S.Theme.moduleSpacing
-    tooltip: ""
+    _panelHovered: hoverPanel.panelHovered
 
     PwObjectTracker {
         objects: [Pipewire.defaultAudioSink, ...root._streamList]
@@ -40,36 +40,22 @@ M.BarSection {
         return streams;
     }
 
-    property bool _osdActive: false
     property bool _volumeInit: false
     property bool _mutedInit: false
-    readonly property bool _anyHover: root._hovered || hoverPanel.panelHovered
-    readonly property bool _showPanel: _anyHover || _osdActive
 
     onVolumeChanged: {
         if (!_volumeInit) {
             _volumeInit = true;
             return;
         }
-        _flashPanel();
+        flashPanel();
     }
     onMutedChanged: {
         if (!_mutedInit) {
             _mutedInit = true;
             return;
         }
-        _flashPanel();
+        flashPanel();
-    }
-
-    function _flashPanel() {
-        _osdActive = true;
-        _osdTimer.restart();
-    }
-
-    Timer {
-        id: _osdTimer
-        interval: 1500
-        onTriggered: root._osdActive = false
     }
 
     M.BarIcon {

shell/modules/qmldir

@@ -22,6 +22,7 @@ NetworkModule 1.0 NetworkModule.qml
 NotifCard 1.0 NotifCard.qml
 NotifPopup 1.0 NotifPopup.qml
 NotificationsModule 1.0 NotificationsModule.qml
+OsdSection 1.0 OsdSection.qml
 OverviewBackdrop 1.0 OverviewBackdrop.qml
 PinnableSection 1.0 PinnableSection.qml
 PopupBackground 1.0 PopupBackground.qml