init: working version

modules/bar/popouts/Wrapper.qml

@@ -0,0 +1,156 @@
+pragma ComponentBehavior: Bound
+
+import qs.config
+import qs.custom
+import qs.services
+import Quickshell
+import Quickshell.Wayland
+import Quickshell.Hyprland
+import QtQuick
+import QtQuick.Effects
+
+Item {
+    id: root
+
+    required property PersistentProperties uiState
+    required property ShellScreen screen
+
+    readonly property real nonAnimWidth: content.implicitWidth
+    readonly property real nonAnimHeight: y > 0 || hasCurrent ? content.implicitHeight : 0
+
+    property string currentName
+    property real currentCenter
+    property bool hasCurrent
+
+    property real currentCenterBounded: Math.min(Math.max(currentCenter, nonAnimWidth / 2),
+                                                 parent.width - nonAnimWidth / 2)
+    x: currentCenterBounded - implicitWidth / 2
+
+    property HyprlandToplevel window
+
+    property bool persistent
+
+    visible: width > 0 && height > 0
+
+    implicitWidth: nonAnimWidth
+    implicitHeight: nonAnimHeight
+
+    Background {
+        id: background
+        visible: false
+        wrapper: root
+    }
+
+    MultiEffect {
+        anchors.fill: background
+        source: background
+        shadowEnabled: true
+        blurMultiplier: 0.3
+        blurMax: 30
+        shadowColor: content.active ? content.item.color : "transparent"
+
+        Behavior on shadowColor {
+            CAnim {}
+        }
+    }
+
+    Item {
+        anchors.fill: parent
+        clip: true
+
+        Comp {
+            id: content
+
+            shouldBeActive: root.hasCurrent
+            asynchronous: true
+            anchors.top: parent.top
+            anchors.horizontalCenter: parent.horizontalCenter
+
+            sourceComponent: Content {
+                id: content
+
+                wrapper: root
+                uiState: root.uiState
+                window: root.window
+            }
+        }
+    }
+
+    Behavior on currentCenterBounded {
+        enabled: root.implicitHeight > 0
+
+        Anim {
+            easing.bezierCurve: Config.anim.curves.emphasized
+        }
+    }
+
+    Behavior on implicitWidth {
+        enabled: root.implicitHeight > 0
+
+        Anim {
+            easing.bezierCurve: Config.anim.curves.emphasized
+        }
+    }
+
+    Behavior on implicitHeight {
+        Anim {
+            easing.bezierCurve: Config.anim.curves.emphasized
+        }
+    }
+
+    component Comp: Loader {
+        id: comp
+
+        property bool shouldBeActive
+
+        asynchronous: true
+        active: false
+        opacity: 0
+
+        states: State {
+            name: "active"
+            when: comp.shouldBeActive
+
+            PropertyChanges {
+                comp.opacity: 1
+                comp.active: true
+            }
+        }
+
+        transitions: [
+            Transition {
+                from: ""
+                to: "active"
+
+                SequentialAnimation {
+                    PropertyAction {
+                        property: "active"
+                    }
+                    Anim {
+                        property: "opacity"
+                        easing.bezierCurve: Config.anim.curves.standard
+                    }
+                }
+            },
+            Transition {
+                from: "active"
+                to: ""
+
+                SequentialAnimation {
+                    Anim {
+                        property: "opacity"
+                        easing.bezierCurve: Config.anim.curves.standard
+                    }
+                    PropertyAction {
+                        property: "active"
+                    }
+                    PropertyAction {
+                        target: root
+                        property: "persistent"
+                        value: false
+                    }
+                }
+            }
+        ]
+    }
+}