feat: bar system tray

modules/bar/Bar.qml

@@ -10,14 +10,13 @@ import QtQuick.Controls
 Variants {
     model: Quickshell.screens
 
-    WlrLayershell {
+    StyledWindow {
         id: win
 
         required property ShellScreen modelData
 
         screen: modelData
-        namespace: "caelestia-bar"
-        color: "transparent"
+        name: "bar"
 
         width: BarConfig.vertical ? BarConfig.preset.totalHeight : -1
         height: BarConfig.vertical ? -1 : BarConfig.preset.totalHeight

modules/bar/Pills.qml

@@ -68,7 +68,11 @@ Item {
                 anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
             }
 
-            StatusIcons {
+            Tray {
+                id: tray
+
+                vertical: BarConfig.vertical
+
                 anchors.left: root.get(clock.right, undefined)
                 anchors.leftMargin: root.get(Appearance.padding.large, 0)
                 anchors.top: root.get(undefined, clock.bottom)
@@ -77,6 +81,16 @@ Item {
                 anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
                 anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
             }
+
+            StatusIcons {
+                anchors.left: root.get(tray.right, undefined)
+                anchors.leftMargin: root.get(Appearance.padding.normal, 0)
+                anchors.top: root.get(undefined, tray.bottom)
+                anchors.topMargin: root.get(0, Appearance.padding.large)
+
+                anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
+                anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
+            }
         }
     }
 

modules/bar/components/Tray.qml

@@ -0,0 +1,54 @@
+import "root:/widgets"
+import "root:/services"
+import "root:/config"
+import Quickshell
+import Quickshell.Widgets
+import Quickshell.Services.SystemTray
+import QtQuick
+import Qt5Compat.GraphicalEffects
+
+BoxLayout {
+    id: root
+
+    Repeater {
+        model: SystemTray.items
+
+        MouseArea {
+            id: item
+
+            required property SystemTrayItem modelData
+
+            acceptedButtons: Qt.LeftButton | Qt.RightButton
+            width: Math.round(Appearance.font.size.large * 1.2)
+            height: Math.round(Appearance.font.size.large * 1.2)
+
+            onClicked: event => {
+                if (event.button === Qt.LeftButton)
+                    modelData.activate();
+                else if (modelData.hasMenu)
+                    menu.open();
+            }
+
+            QsMenuAnchor {
+                id: menu
+
+                menu: item.modelData.menu
+                anchor.window: QsWindow.window
+            }
+
+            IconImage {
+                id: icon
+
+                visible: false
+                source: item.modelData.icon
+                anchors.fill: parent
+            }
+
+            ColorOverlay {
+                anchors.fill: icon
+                source: icon
+                color: Appearance.colours.lavender
+            }
+        }
+    }
+}

widgets/StyledText.qml

@@ -12,6 +12,7 @@ Text {
     renderType: Text.NativeRendering
     color: Appearance.colours.text
     font.family: Appearance.font.family.sans
+    font.pointSize: Appearance.font.size.smaller
 
     Behavior on color {
         ColorAnimation {

widgets/StyledWindow.qml

@@ -0,0 +1,10 @@
+import "root:/utils"
+import "root:/config"
+import Quickshell.Wayland
+
+WlrLayershell {
+    required property string name
+
+    namespace: `caelestia-${name}`
+    color: "transparent"
+}