group modules

modules/Bar.qml

@@ -72,19 +72,41 @@ PanelWindow {
             Item {
                 Layout.fillWidth: true
             }
+
+            // Media
+            M.BarGroup {
                 M.Mpris {}
                 M.Volume { visible: M.Modules.volume }
-            M.Bluetooth {}
-            M.Backlight {}
+            }
+
+            // Connectivity
+            M.BarGroup {
                 M.Network { visible: M.Modules.network }
+                M.Bluetooth {}
+            }
+
+            // Controls
+            M.BarGroup {
+                M.Backlight {}
                 M.PowerProfile { visible: M.Modules.powerProfile }
                 M.IdleInhibitor { visible: M.Modules.idleInhibitor }
-            M.Weather { visible: M.Modules.weather }
-            M.Temperature { visible: M.Modules.temperature }
+            }
+
+            // System
+            M.BarGroup {
                 M.Cpu { visible: M.Modules.cpu }
                 M.Memory { visible: M.Modules.memory }
+                M.Temperature { visible: M.Modules.temperature }
+            }
+
+            // Status
+            M.BarGroup {
+                M.Weather { visible: M.Modules.weather }
                 M.Disk { visible: M.Modules.disk }
                 M.Battery {}
+            }
+
+            // Power
             M.Wlogout { bar: bar; visible: M.Modules.wlogout }
         }
     }

modules/BarGroup.qml

@@ -0,0 +1,26 @@
+import QtQuick
+import "." as M
+
+Rectangle {
+    id: root
+
+    default property alias content: row.children
+
+    color: "transparent"
+    border.color: M.Theme.base02
+    border.width: 1
+    radius: M.Theme.radius
+
+    visible: row.visibleChildren.length > 0
+
+    implicitWidth: row.implicitWidth + _pad * 2
+    implicitHeight: row.implicitHeight + _pad * 2
+
+    readonly property int _pad: 6
+
+    Row {
+        id: row
+        anchors.centerIn: parent
+        spacing: M.Theme.moduleSpacing + 2
+    }
+}

modules/Wlogout.qml

@@ -1,5 +1,6 @@
 import QtQuick
 import Quickshell
+import Quickshell.Io
 import "." as M
 
 M.BarIcon {

modules/qmldir

@@ -4,6 +4,7 @@ singleton FlyoutState 1.0 FlyoutState.qml
 singleton OsdState 1.0 OsdState.qml
 singleton Modules 1.0 Modules.qml
 Bar 1.0 Bar.qml
+BarGroup 1.0 BarGroup.qml
 BarSection 1.0 BarSection.qml
 Flyout 1.0 Flyout.qml
 Workspaces 1.0 Workspaces.qml