osd: fix anim when appear on change

modules/drawers/Interactions.qml

@@ -1,8 +1,6 @@
 import qs.components.controls
-import qs.services
 import qs.config
 import qs.modules.bar.popouts as BarPopouts
-import qs.modules.osd as Osd
 import Quickshell
 import QtQuick
 
@@ -15,7 +13,6 @@ CustomMouseArea {
     required property Panels panels
     required property Item bar
 
-    property bool osdHovered
     property point dragStart
     property bool dashboardShortcutActive
     property bool osdShortcutActive
@@ -62,7 +59,7 @@ CustomMouseArea {
             // Only hide if not activated by shortcut
             if (!osdShortcutActive) {
                 visibilities.osd = false;
-                osdHovered = false;
+                root.panels.osd.hovered = false;
             }
 
             if (!dashboardShortcutActive)
@@ -105,11 +102,11 @@ CustomMouseArea {
         // Always update visibility based on hover if not in shortcut mode
         if (!osdShortcutActive) {
             visibilities.osd = showOsd;
-            osdHovered = showOsd;
+            root.panels.osd.hovered = showOsd;
         } else if (showOsd) {
             // If hovering over OSD area while in shortcut mode, transition to hover control
             osdShortcutActive = false;
-            osdHovered = true;
+            root.panels.osd.hovered = true;
         }
 
         // Show/hide session on drag
@@ -191,7 +188,7 @@ CustomMouseArea {
                 }
                 if (!inOsdArea) {
                     root.visibilities.osd = false;
-                    root.osdHovered = false;
+                    root.panels.osd.hovered = false;
                 }
             }
         }
@@ -235,10 +232,4 @@ CustomMouseArea {
             }
         }
     }
-
-    Osd.Interactions {
-        screen: root.screen
-        visibilities: root.visibilities
-        hovered: root.osdHovered
-    }
 }

modules/osd/Content.qml

@@ -14,6 +14,12 @@ Item {
     required property Brightness.Monitor monitor
     required property var visibilities
 
+    required property real volume
+    required property bool muted
+    required property real sourceVolume
+    required property bool sourceMuted
+    required property real brightness
+
     implicitWidth: layout.implicitWidth + Appearance.padding.large * 2
     implicitHeight: layout.implicitHeight + Appearance.padding.large * 2
 
@@ -38,8 +44,8 @@ Item {
             FilledSlider {
                 anchors.fill: parent
 
-                icon: Icons.getVolumeIcon(value, Audio.muted)
+                icon: Icons.getVolumeIcon(value, root.muted)
-                value: Audio.volume
+                value: root.volume
                 onMoved: Audio.setVolume(value)
             }
         }
@@ -62,8 +68,8 @@ Item {
                 FilledSlider {
                     anchors.fill: parent
 
-                    icon: Icons.getMicVolumeIcon(value, Audio.sourceMuted)
+                    icon: Icons.getMicVolumeIcon(value, root.sourceMuted)
-                    value: Audio.sourceVolume
+                    value: root.sourceVolume
                     onMoved: Audio.setSourceVolume(value)
                 }
             }
@@ -91,7 +97,7 @@ Item {
                     anchors.fill: parent
 
                     icon: `brightness_${(Math.round(value * 6) + 1)}`
-                    value: root.monitor?.brightness ?? 0
+                    value: root.brightness
                     onMoved: root.monitor?.setBrightness(value)
                 }
             }

modules/osd/Interactions.qml

@@ -1,48 +0,0 @@
-import qs.services
-import qs.config
-import Quickshell
-import QtQuick
-
-Scope {
-    id: root
-
-    required property ShellScreen screen
-    required property PersistentProperties visibilities
-    required property bool hovered
-    readonly property Brightness.Monitor monitor: Brightness.getMonitorForScreen(screen)
-
-    function show(): void {
-        root.visibilities.osd = true;
-        timer.restart();
-    }
-
-    Connections {
-        target: Audio
-
-        function onMutedChanged(): void {
-            root.show();
-        }
-
-        function onVolumeChanged(): void {
-            root.show();
-        }
-    }
-
-    Connections {
-        target: root.monitor
-
-        function onBrightnessChanged(): void {
-            root.show();
-        }
-    }
-
-    Timer {
-        id: timer
-
-        interval: Config.osd.hideDelay
-        onTriggered: {
-            if (!root.hovered)
-                root.visibilities.osd = false;
-        }
-    }
-}

modules/osd/Wrapper.qml

@@ -11,6 +11,27 @@ Item {
 
     required property ShellScreen screen
     required property var visibilities
+    property bool hovered
+    readonly property Brightness.Monitor monitor: Brightness.getMonitorForScreen(root.screen)
+
+    property real volume
+    property bool muted
+    property real sourceVolume
+    property bool sourceMuted
+    property real brightness
+
+    function show(): void {
+        visibilities.osd = true;
+        timer.restart();
+    }
+
+    Component.onCompleted: {
+        volume = Audio.volume;
+        muted = Audio.muted;
+        sourceVolume = Audio.sourceVolume;
+        sourceMuted = Audio.sourceMuted;
+        brightness = root.monitor?.brightness ?? 0;
+    }
 
     visible: width > 0
     implicitWidth: 0
@@ -48,6 +69,49 @@ Item {
         }
     ]
 
+    Connections {
+        target: Audio
+
+        function onMutedChanged(): void {
+            root.show();
+            root.muted = Audio.muted;
+        }
+
+        function onVolumeChanged(): void {
+            root.show();
+            root.volume = Audio.volume;
+        }
+
+        function onSourceMutedChanged(): void {
+            root.show();
+            root.sourceMuted = Audio.sourceMuted;
+        }
+
+        function onSourceVolumeChanged(): void {
+            root.show();
+            root.sourceVolume = Audio.sourceVolume;
+        }
+    }
+
+    Connections {
+        target: root.monitor
+
+        function onBrightnessChanged(): void {
+            root.show();
+            root.brightness = root.monitor?.brightness ?? 0;
+        }
+    }
+
+    Timer {
+        id: timer
+
+        interval: Config.osd.hideDelay
+        onTriggered: {
+            if (!root.hovered)
+                root.visibilities.osd = false;
+        }
+    }
+
     Loader {
         id: content
 
@@ -57,8 +121,13 @@ Item {
         Component.onCompleted: active = Qt.binding(() => (root.visibilities.osd && Config.osd.enabled) || root.visible)
 
         sourceComponent: Content {
-            monitor: Brightness.getMonitorForScreen(root.screen)
+            monitor: root.monitor
             visibilities: root.visibilities
+            volume: root.volume
+            muted: root.muted
+            sourceVolume: root.sourceVolume
+            sourceMuted: root.sourceMuted
+            brightness: root.brightness
         }
     }
 }