From c3a91e7554f1421ee503c50cf045f658bc3811fd Mon Sep 17 00:00:00 2001
From: 2 * r + 2 * t <61896496+soramanew@users.noreply.github.com>
Date: Fri, 6 Jun 2025 20:46:03 +1000
Subject: popouts: transition between popout content

---
 modules/bar/popouts/Content.qml | 64 ++++++++++++++++++++++++++++-------------
 1 file changed, 44 insertions(+), 20 deletions(-)

(limited to 'modules')

diff --git a/modules/bar/popouts/Content.qml b/modules/bar/popouts/Content.qml
index 4307ea7..1f9da27 100644
--- a/modules/bar/popouts/Content.qml
+++ b/modules/bar/popouts/Content.qml
@@ -63,28 +63,52 @@ Item {
         anchors.verticalCenter: parent.verticalCenter
         anchors.right: parent.right
 
-        active: shouldBeActive
+        opacity: 0
+        scale: 0.8
         asynchronous: true
 
-        // Behavior on active {
-        //     SequentialAnimation {
-        //         Anim {
-        //             target: popout
-        //             property: "opacity"
-        //             from: popout.shouldBeActive ? 1 : 0
-        //             to: popout.shouldBeActive ? 0 : 1
-        //             duration: popout.shouldBeActive ? 0 : Appearance.anim.durations.normal
-        //         }
-        //         PropertyAction {}
-        //         Anim {
-        //             target: popout
-        //             property: "opacity"
-        //             from: popout.shouldBeActive ? 0 : 1
-        //             to: popout.shouldBeActive ? 1 : 0
-        //             duration: popout.shouldBeActive ? Appearance.anim.durations.normal : 0
-        //         }
-        //     }
-        // }
+        states: State {
+            name: "active"
+            when: popout.shouldBeActive
+
+            PropertyChanges {
+                popout.active: true
+                popout.opacity: 1
+                popout.scale: 1
+            }
+        }
+
+        transitions: [
+            Transition {
+                from: "active"
+                to: ""
+
+                SequentialAnimation {
+                    Anim {
+                        properties: "opacity,scale"
+                        duration: Appearance.anim.durations.small
+                    }
+                    PropertyAction {
+                        target: popout
+                        property: "active"
+                    }
+                }
+            },
+            Transition {
+                from: ""
+                to: "active"
+
+                SequentialAnimation {
+                    PropertyAction {
+                        target: popout
+                        property: "active"
+                    }
+                    Anim {
+                        properties: "opacity,scale"
+                    }
+                }
+            }
+        ]
     }
 
     component Anim: NumberAnimation {
-- 
cgit v1.2.3-freya