barmodule: own hoverpanel internally, modules supply content as component

shell/modules/BacklightModule.qml

@@ -10,6 +10,17 @@ M.BarModule {
     opacity: S.Modules.backlight.enable && S.BacklightService.available ? 1 : 0
     visible: opacity > 0
     tooltip: "Brightness: " + percent + "%"
+    panelNamespace: "nova-backlight"
+    panelTitle: "Brightness"
+    panelContentWidth: 200
+    panelComponent: Component {
+        C.BacklightApplet {
+            width: parent.width
+            percent: root.percent
+            accentColor: root.accentColor
+            onSetPercent: pct => S.BacklightService.setPercent(pct)
+        }
+    }
 
     property int percent: S.BacklightService.percent
     property bool _percentInit: false
@@ -36,23 +47,4 @@ M.BarModule {
         minText: "100%"
         anchors.verticalCenter: parent.verticalCenter
     }
-
-    M.HoverPanel {
-        id: hoverPanel
-        showPanel: root._showPanel
-        screen: QsWindow.window?.screen ?? null
-        anchorItem: root
-        accentColor: root.accentColor
-        panelNamespace: "nova-backlight"
-        panelTitle: "Brightness"
-        contentWidth: 200
-        onDismissed: root.dismissPanel()
-
-        C.BacklightApplet {
-            width: parent.width
-            percent: root.percent
-            accentColor: root.accentColor
-            onSetPercent: pct => S.BacklightService.setPercent(pct)
-        }
-    }
 }