fix(Launcher): activeRect still lasting on old focus/selection

feat(Launcher): more animations and visual cues

10 files changed, 165 insertions, 182 deletions

diff --git a/bar/Workspace.qml b/bar/Workspace.qml
index a0f5f0e..1366c2d 100644
--- a/bar/Workspace.qml
+++ b/bar/Workspace.qml
@@ -1,8 +1,6 @@
 import QtQuick
 import QtQuick.Layouts
-import Quickshell
 import Quickshell.Hyprland
-import Quickshell.Wayland
 import Qt5Compat.GraphicalEffects
 import qs.config
 import qs.components
@@ -57,7 +55,7 @@ Item {
     }
     IRect {
         id: activeRect
-        x: layout.x + activeIndex * Bar.wsIconSize + activeIndex * Bar.wsSpacing
+        x: layout.x + root.activeIndex * Bar.wsIconSize + root.activeIndex * Bar.wsSpacing
         anchors.verticalCenter: layout.verticalCenter
         implicitWidth: Bar.wsActiveIconSize
         implicitHeight: Bar.wsIconSize - Bar.wsHorizontalSpacing
@@ -219,7 +217,7 @@ Item {
         onPositionChanged: {
             const abovedItemIndex = Math.round((mouseX - layout.x) / (Bar.wsIconSize + Bar.wsSpacing)) - 1; // TODO: workspaceActiveIconSize might be before
             activeRect.x = mouseX - activeRect.width / 2;
-            root.activeOccupied = getWorkspaceStats(abovedItemIndex).isOccupied || false;
+            root.activeOccupied = root.getWorkspaceStats(abovedItemIndex).isOccupied || false;
             activeRect.implicitWidth = root.activeIndex === abovedItemIndex ? Bar.wsActiveIconSize : Bar.wsIconSize;
         }
         onExited: {
@@ -227,18 +225,18 @@ Item {
                 // just in case
                 activeRect.x = layout.x + root.activeIndex * Bar.wsIconSize + root.activeIndex * Bar.wsSpacing;
                 activeRect.implicitWidth = Bar.wsActiveIconSize;
-                root.activeOccupied = getWorkspaceStats(root.activeIndex).isOccupied || false;
+                root.activeOccupied = root.getWorkspaceStats(root.activeIndex).isOccupied || false;
             }
         }
         onWheel: event => {
             // no idea wats wrong w/ prev so we just unify it to use +/- 1
             if (event.angleDelta.y < 0) {
-                if (activeIndex + 1 < Bar.wss)
+                if (root.activeIndex + 1 < Bar.wss)
                     Hyprland.dispatch(`hl.dsp.focus({ workspace = '+1' })`);
                 else
                     Hyprland.dispatch(`hl.dsp.focus({ workspace = '1' })`);
             } else if (event.angleDelta.y > 0) {
-                if (activeIndex + 1 > 1) {
+                if (root.activeIndex + 1 > 1) {
                     Hyprland.dispatch(`hl.dsp.focus({ workspace = '1' })`);
                 } else if (Bar.wss > 1) {
                     Hyprland.dispatch(`hl.dsp.focus({ workspace = '${Bar.wss}' })`);
diff --git a/popups/launcher/Launcher.qml b/popups/launcher/Launcher.qml
index 5db25cc..2b3f40f 100644
--- a/popups/launcher/Launcher.qml
+++ b/popups/launcher/Launcher.qml
@@ -209,6 +209,7 @@ ILauncher {
                         onTextChanged: {
                             if (launcher.state.input !== textInput.text)
                                 pendingUpdate = true;
+
                             Qt.callLater(() => {
                                 if (pendingUpdate) {
                                     pendingUpdate = false;
@@ -422,19 +423,22 @@ ILauncher {
             break;
         }
 
-        switch (set) {
-        case 1:
-            if (launcher.state.selectedPriority < launcher.state.priorities.length - 1) {
-                launcher.state.selectedPriority++;
-                launcher.state.priorities[launcher.state.selectedPriority].home();
-            }
-            break;
-        case -1:
-            if (launcher.state.selectedPriority > 0) {
-                launcher.state.selectedPriority--;
-                launcher.state.priorities[launcher.state.selectedPriority].end();
+        if (set !== 0) {
+            // launcher.state.priorities[launcher.state.selectedPriority].syncSelectionState();
+            switch (set) {
+            case 1:
+                if (launcher.state.selectedPriority < launcher.state.priorities.length - 1) {
+                    launcher.state.selectedPriority++;
+                    launcher.state.priorities[launcher.state.selectedPriority].home();
+                }
+                break;
+            case -1:
+                if (launcher.state.selectedPriority > 0) {
+                    launcher.state.selectedPriority--;
+                    launcher.state.priorities[launcher.state.selectedPriority].end();
+                }
+                break;
             }
-            break;
         }
     }
 
diff --git a/popups/launcher/components/App.qml b/popups/launcher/components/App.qml
index 964211d..a4c0d2c 100644
--- a/popups/launcher/components/App.qml
+++ b/popups/launcher/components/App.qml
@@ -56,25 +56,24 @@ IComponent {
     home: function () {
         if (selectedIndex <= 0)
             return true;
-        selectedIndex = -1;
         selectedIndex = 0;
     }
     end: function () {
         if (selectedIndex + 1 > listView.count - 1)
             return true;
-        selectedIndex = listView.count;
         selectedIndex = listView.count - 1;
     }
 
     pgup: function () {
         if (listView.count === 0)
             return true;
+
         const pageSize = Math.floor(listView.height / (General.appIconSize + Launcher.innerMargin * 2));
-        if (selectedIndex - pageSize < 0) {
+
+        if (selectedIndex - pageSize < 0)
             selectedIndex = 0;
-        } else {
+        else
             selectedIndex -= pageSize;
-        }
     }
 
     pgdn: function () {
@@ -100,14 +99,21 @@ IComponent {
     }
 
     onSelectedIndexChanged: {
-        syncSelectionState();
         Qt.callLater(() => {
+            // so at least it exist
+            listView.positionViewAtIndex(selectedIndex, ListView.Visible);
+            syncSelectionState();
             listView.positionViewAtIndex(selectedIndex, ListView.Contain);
         });
     }
 
     syncSelectionState: function () {
         Qt.callLater(() => {
+            if (!isSelectedPriority() && state.selected === listView.itemAtIndex(selectedIndex)) {
+                state.selected = null;
+                return;
+            }
+
             if (selectedIndex < 0 || selectedIndex >= listView.count || !root.visible)
                 return;
 
@@ -139,7 +145,7 @@ IComponent {
 
                 RowLayout {
                     id: item
-                    scale: index === selectedIndex ? 1.01 : 0.99
+                    scale: isSelectedPriority() && index === selectedIndex ? 1.01 : 0.99
                     anchors.left: parent.left
                     anchors.top: parent.top
                     anchors.margins: Launcher.innerMargin * 2
@@ -153,7 +159,14 @@ IComponent {
                     IText {
                         text: modelData ? modelData.name : ""
                         renderType: Text.QtRendering
-                        color: index === selectedIndex ? Colors.foreground1 : Colors.foreground2
+                        font.bold: isSelectedPriority() && index === selectedIndex
+                        color: isSelectedPriority() && index === selectedIndex ? Colors.foreground1 : Colors.foreground2
+                        Behavior on color {
+                            ColorAnimation {
+                                duration: General.animationDuration
+                                easing.type: Easing.InOutQuad
+                            }
+                        }
                     }
 
                     Behavior on scale {
diff --git a/popups/launcher/components/Calc.qml b/popups/launcher/components/Calc.qml
index 64cde8c..dee1668 100644
--- a/popups/launcher/components/Calc.qml
+++ b/popups/launcher/components/Calc.qml
@@ -19,74 +19,36 @@ IComponent {
     }
 
     onInputChanged: {
-	    MathCalc.reset_result();
+        MathCalc.reset_result();
     }
 
     process: function () {
-	    MathCalc.query(input);
-	    const valid = MathCalc.result && MathCalc.result.length > 0;
+        MathCalc.query(input);
+        const valid = MathCalc.result && MathCalc.result.length > 0;
         const answer = MathCalc.result ? MathCalc.result
-	        // 1. Calculus & Summations (Case insensitive)
-            .replace(/\bint(?:egral)?\b/gi, "∫")
-            .replace(/\bsum\b/gi, "∑")
-
-            // 2. Constants & Symbols (Case insensitive)
-            .replace(/\bpi\b/gi, "π")
-            .replace(/\btau\b/gi, "τ")
-            .replace(/\binf(?:inity)?\b/gi, "∞")
-            .replace(/\bdeg\b/gi, "°")
-
-            // 3. Roots & Exponentials (Case insensitive)
-            .replace(/\bsqrt\b/gi, "√")
-            .replace(/\bcbrt\b/gi, "∛")
-
-            // 4. Rounding & Absolute Value (Case insensitive)
-            .replace(/\bceil\(([^\)]+)\)/gi, "⌈$1⌉")
-            .replace(/\bfloor\(([^\)]+)\)/gi, "⌊$1⌋")
-            .replace(/\bround\b/gi, " ≈ ")
-
-            // 5. Comparison & Equality
-            .replace(/\s*<=\s*/g, " ≤ ")
-            .replace(/\s*>=\s*/g, " ≥ ")
-            .replace(/\s*!=\s*/g, " ≠ ")
-            .replace(/\s*==\s*/g, " = ")
-
-            // 6. Exponents to Unicode Superscripts FIRST (Case insensitive for ^n, ^x, ^y)
-            .replace(/\^0/g, "⁰")
-            .replace(/\^1/g, "¹")
-            .replace(/\^2/g, "²")
-            .replace(/\^3/g, "³")
-            .replace(/\^4/g, "⁴")
-            .replace(/\^5/g, "⁵")
-            .replace(/\^6/g, "⁶")
-            .replace(/\^7/g, "⁷")
-            .replace(/\^8/g, "⁸")
-            .replace(/\^9/g, "⁹")
-            .replace(/\^\+/g, "⁺")
-            .replace(/\^-/g, "⁻")
-            .replace(/\^n/gi, "ⁿ")
-            .replace(/\^x/gi, "ˣ")
-            .replace(/\^y/gi, "ʸ")
-
-            // 7. Kalk Number Bases
-            .replace(/_0/g, "₀")
-            .replace(/_10/g, "₁₀")
-            .replace(/_16/g, "₁₆")
-            .replace(/_1/g, "₁")
-            .replace(/_2/g, "₂")
-            .replace(/_3/g, "₃")
-            .replace(/_4/g, "₄")
-            .replace(/_5/g, "₅")
-            .replace(/_6/g, "₆")
-            .replace(/_7/g, "₇")
-            .replace(/_8/g, "₈")
-            .replace(/_9/g, "₉")
-
-            // 8. Arithmetic Operators
-            .replace(/\s*\*\s*/g, " × ")
-            .replace(/\s*\/\s*/g, " ÷ ")
-            .replace(/\s*-\s*/g, " − ")
-            .replace(/\s*\+\s*/g, " + ") : ""
+        // 1. Calculus & Summations (Case insensitive)
+        .replace(/\bint(?:egral)?\b/gi, "∫").replace(/\bsum\b/gi, "∑")
+
+        // 2. Constants & Symbols (Case insensitive)
+        .replace(/\bpi\b/gi, "π").replace(/\btau\b/gi, "τ").replace(/\binf(?:inity)?\b/gi, "∞").replace(/\bdeg\b/gi, "°")
+
+        // 3. Roots & Exponentials (Case insensitive)
+        .replace(/\bsqrt\b/gi, "√").replace(/\bcbrt\b/gi, "∛")
+
+        // 4. Rounding & Absolute Value (Case insensitive)
+        .replace(/\bceil\(([^\)]+)\)/gi, "⌈$1⌉").replace(/\bfloor\(([^\)]+)\)/gi, "⌊$1⌋").replace(/\bround\b/gi, " ≈ ")
+
+        // 5. Comparison & Equality
+        .replace(/\s*<=\s*/g, " ≤ ").replace(/\s*>=\s*/g, " ≥ ").replace(/\s*!=\s*/g, " ≠ ").replace(/\s*==\s*/g, " = ")
+
+        // 6. Exponents to Unicode Superscripts FIRST (Case insensitive for ^n, ^x, ^y)
+        .replace(/\^0/g, "⁰").replace(/\^1/g, "¹").replace(/\^2/g, "²").replace(/\^3/g, "³").replace(/\^4/g, "⁴").replace(/\^5/g, "⁵").replace(/\^6/g, "⁶").replace(/\^7/g, "⁷").replace(/\^8/g, "⁸").replace(/\^9/g, "⁹").replace(/\^\+/g, "⁺").replace(/\^-/g, "⁻").replace(/\^n/gi, "ⁿ").replace(/\^x/gi, "ˣ").replace(/\^y/gi, "ʸ")
+
+        // 7. Kalk Number Bases
+        .replace(/_0/g, "₀").replace(/_10/g, "₁₀").replace(/_16/g, "₁₆").replace(/_1/g, "₁").replace(/_2/g, "₂").replace(/_3/g, "₃").replace(/_4/g, "₄").replace(/_5/g, "₅").replace(/_6/g, "₆").replace(/_7/g, "₇").replace(/_8/g, "₈").replace(/_9/g, "₉")
+
+        // 8. Arithmetic Operators
+        .replace(/\s*\*\s*/g, " × ").replace(/\s*\/\s*/g, " ÷ ").replace(/\s*-\s*/g, " − ").replace(/\s*\+\s*/g, " + ") : "";
         return {
             valid,
             priority: valid,
@@ -116,70 +78,32 @@ IComponent {
                     renderType: Text.CurveRendering
                     visible: valid
                     text: input
-	                    // 1. Calculus & Summations (Case insensitive)
-                        .replace(/\bint(?:egral)?\b/gi, "∫")
-                        .replace(/\bsum\b/gi, "∑")
-
-                        // 2. Constants & Symbols (Case insensitive)
-                        .replace(/\bpi\b/gi, "π")
-                        .replace(/\btau\b/gi, "τ")
-                        .replace(/\binf(?:inity)?\b/gi, "∞")
-                        .replace(/\bdeg\b/gi, "°")
-
-                        // 3. Roots & Exponentials (Case insensitive)
-                        .replace(/\bsqrt\b/gi, "√")
-                        .replace(/\bcbrt\b/gi, "∛")
-
-                        // 4. Rounding & Absolute Value (Case insensitive)
-                        .replace(/\bceil\(([^\)]+)\)/gi, "⌈$1⌉")
-                        .replace(/\bfloor\(([^\)]+)\)/gi, "⌊$1⌋")
-                        .replace(/\bround\b/gi, " ≈ ")
-
-                        // 5. Comparison & Equality
-                        .replace(/\s*<=\s*/g, " ≤ ")
-                        .replace(/\s*>=\s*/g, " ≥ ")
-                        .replace(/\s*!=\s*/g, " ≠ ")
-                        .replace(/\s*==\s*/g, " = ")
-
-                        // 6. Exponents to Unicode Superscripts FIRST (Case insensitive for ^n, ^x, ^y)
-                        .replace(/\^0/g, "⁰")
-                        .replace(/\^1/g, "¹")
-                        .replace(/\^2/g, "²")
-                        .replace(/\^3/g, "³")
-                        .replace(/\^4/g, "⁴")
-                        .replace(/\^5/g, "⁵")
-                        .replace(/\^6/g, "⁶")
-                        .replace(/\^7/g, "⁷")
-                        .replace(/\^8/g, "⁸")
-                        .replace(/\^9/g, "⁹")
-                        .replace(/\^\+/g, "⁺")
-                        .replace(/\^-/g, "⁻")
-                        .replace(/\^n/gi, "ⁿ")
-                        .replace(/\^x/gi, "ˣ")
-                        .replace(/\^y/gi, "ʸ")
-
-                        // 7. Kalk Number Bases
-                        .replace(/_0/g, "₀")
-                        .replace(/_10/g, "₁₀")
-                        .replace(/_16/g, "₁₆")
-                        .replace(/_1/g, "₁")
-                        .replace(/_2/g, "₂")
-                        .replace(/_3/g, "₃")
-                        .replace(/_4/g, "₄")
-                        .replace(/_5/g, "₅")
-                        .replace(/_6/g, "₆")
-                        .replace(/_7/g, "₇")
-                        .replace(/_8/g, "₈")
-                        .replace(/_9/g, "₉")
-
-                        // 8. Arithmetic Operators
-                        .replace(/\s*\*\s*/g, " × ")
-                        .replace(/\s*\/\s*/g, " ÷ ")
-                        .replace(/\s*-\s*/g, " − ")
-                        .replace(/\s*\+\s*/g, " + ")
+                    // 1. Calculus & Summations (Case insensitive)
+                    .replace(/\bint(?:egral)?\b/gi, "∫").replace(/\bsum\b/gi, "∑")
+
+                    // 2. Constants & Symbols (Case insensitive)
+                    .replace(/\bpi\b/gi, "π").replace(/\btau\b/gi, "τ").replace(/\binf(?:inity)?\b/gi, "∞").replace(/\bdeg\b/gi, "°")
+
+                    // 3. Roots & Exponentials (Case insensitive)
+                    .replace(/\bsqrt\b/gi, "√").replace(/\bcbrt\b/gi, "∛")
+
+                    // 4. Rounding & Absolute Value (Case insensitive)
+                    .replace(/\bceil\(([^\)]+)\)/gi, "⌈$1⌉").replace(/\bfloor\(([^\)]+)\)/gi, "⌊$1⌋").replace(/\bround\b/gi, " ≈ ")
+
+                    // 5. Comparison & Equality
+                    .replace(/\s*<=\s*/g, " ≤ ").replace(/\s*>=\s*/g, " ≥ ").replace(/\s*!=\s*/g, " ≠ ").replace(/\s*==\s*/g, " = ")
+
+                    // 6. Exponents to Unicode Superscripts FIRST (Case insensitive for ^n, ^x, ^y)
+                    .replace(/\^0/g, "⁰").replace(/\^1/g, "¹").replace(/\^2/g, "²").replace(/\^3/g, "³").replace(/\^4/g, "⁴").replace(/\^5/g, "⁵").replace(/\^6/g, "⁶").replace(/\^7/g, "⁷").replace(/\^8/g, "⁸").replace(/\^9/g, "⁹").replace(/\^\+/g, "⁺").replace(/\^-/g, "⁻").replace(/\^n/gi, "ⁿ").replace(/\^x/gi, "ˣ").replace(/\^y/gi, "ʸ")
+
+                    // 7. Kalk Number Bases
+                    .replace(/_0/g, "₀").replace(/_10/g, "₁₀").replace(/_16/g, "₁₆").replace(/_1/g, "₁").replace(/_2/g, "₂").replace(/_3/g, "₃").replace(/_4/g, "₄").replace(/_5/g, "₅").replace(/_6/g, "₆").replace(/_7/g, "₇").replace(/_8/g, "₈").replace(/_9/g, "₉")
+
+                    // 8. Arithmetic Operators
+                    .replace(/\s*\*\s*/g, " × ").replace(/\s*\/\s*/g, " ÷ ").replace(/\s*-\s*/g, " − ").replace(/\s*\+\s*/g, " + ")
                     font {
                         pixelSize: Launcher.widgetFontSize
-                        bold: true
+                        bold: isSelectedPriority()
                     }
                 }
             }
@@ -188,7 +112,7 @@ IComponent {
                 visible: valid
                 text: "→"
                 font.pixelSize: Launcher.widgetFontSize
-                font.bold: true
+                font.bold: isSelectedPriority()
             }
 
             Item {
@@ -202,7 +126,7 @@ IComponent {
                     text: valid ? answer : ''
                     font {
                         pixelSize: Launcher.widgetFontSize
-                        bold: true
+                        bold: isSelectedPriority()
                     }
                 }
             }
diff --git a/popups/launcher/components/Clip.qml b/popups/launcher/components/Clip.qml
index ebcc8c4..39712ef 100644
--- a/popups/launcher/components/Clip.qml
+++ b/popups/launcher/components/Clip.qml
@@ -75,6 +75,11 @@ IComponent {
 
     syncSelectionState: function () {
         Qt.callLater(() => {
+            if (!isSelectedPriority() && state.selected === listView.itemAtIndex(selectedIndex)) {
+                state.selected = null;
+                return;
+            }
+
             if (!root.visible || selectedIndex < 0 || selectedIndex >= listView.count)
                 return;
 
@@ -116,7 +121,7 @@ IComponent {
                         clip: true
 
                         IconImage {
-                            scale: index === root.selectedIndex ? 1.01 : 0.9
+                            scale: isSelectedPriority() && index === root.selectedIndex ? 1.01 : 0.9
                             source: modelData?.appIcon
                             implicitSize: parent.height
 
@@ -130,13 +135,18 @@ IComponent {
                                 sourceComponent: modelData?.type === "image" ? img : text
                                 readonly property Component text: IText {
                                     text: modelData?.data || ""
-                                    color: index === root.selectedIndex ? Colors.foreground1 : Colors.foreground2
+                                    color: isSelectedPriority() && index === selectedIndex ? Colors.foreground1 : Colors.foreground2
                                     font.pixelSize: Launcher.widgetFontSize
+                                    font.bold: isSelectedPriority() && index === selectedIndex
                                 }
                                 readonly property Component img: Image {
                                     source: modelData?.data || ""
                                     height: Launcher.widgetFontSize * 1.3
                                     fillMode: Image.PreserveAspectFit
+                                    scale: isSelectedPriority() && index === root.selectedIndex ? 1.01 : 0.9
+                                    Behavior on scale {
+                                        ISpringAnimation {}
+                                    }
                                 }
                             }
                             Row {
@@ -144,18 +154,18 @@ IComponent {
                                 property string sinceWhen: TimeDate.sinceWhen(modelData?.timestamp) || ""
                                 IText {
                                     text: modelData.type
-                                    color: index === root.selectedIndex ? Colors.foreground2 : Colors.foreground3
+                                    color: isSelectedPriority() && index === root.selectedIndex ? Colors.foreground2 : Colors.foreground3
                                     font.pixelSize: Launcher.widgetFontSize / 1.35
                                 }
                                 IText {
                                     visible: parent.sinceWhen
                                     text: '·'
-                                    color: index === root.selectedIndex ? Colors.foreground2 : Colors.foreground3
+                                    color: isSelectedPriority() && index === root.selectedIndex ? Colors.foreground2 : Colors.foreground3
                                     font.pixelSize: Launcher.widgetFontSize / 1.35
                                 }
                                 IText {
                                     text: parent.sinceWhen || ""
-                                    color: index === root.selectedIndex ? Colors.foreground2 : Colors.foreground3
+                                    color: isSelectedPriority() && index === root.selectedIndex ? Colors.foreground2 : Colors.foreground3
                                     font.pixelSize: Launcher.widgetFontSize / 1.35
                                 }
                             }
diff --git a/popups/launcher/components/DuckDuckGo.qml b/popups/launcher/components/DuckDuckGo.qml
index 3c410d7..928ca05 100644
--- a/popups/launcher/components/DuckDuckGo.qml
+++ b/popups/launcher/components/DuckDuckGo.qml
@@ -72,6 +72,7 @@ IComponent {
                     id: image
                     property real maxWidth: status === Image.Ready ? implicitWidth : 0
                     anchors.fill: parent
+                    scale: isSelectedPriority() ? 1.01 : 0.99
 
                     fillMode: Image.PreserveAspectCrop
 
@@ -89,6 +90,10 @@ IComponent {
                     Behavior on maxWidth {
                         ISpringAnimation {}
                     }
+
+                    Behavior on scale {
+                        ISpringAnimation {}
+                    }
                 }
             }
 
@@ -112,7 +117,7 @@ IComponent {
                     text: answer
                     font {
                         pixelSize: Launcher.widgetFontSize * 1.1
-                        bold: true
+                        bold: isSelectedPriority()
                     }
                 }
 
diff --git a/popups/launcher/components/Emoji.qml b/popups/launcher/components/Emoji.qml
index 36aacb0..f45ada0 100644
--- a/popups/launcher/components/Emoji.qml
+++ b/popups/launcher/components/Emoji.qml
@@ -35,12 +35,17 @@ IComponent {
 
     onSelectedIndexChanged: {
         Qt.callLater(() => {
-            if (!loader.view || selectedIndex < 0 || selectedIndex >= loader.view.count)
+            if (!loader?.view || selectedIndex < 0 || selectedIndex >= loader.view.count)
                 return;
 
-            syncSelectionState();
+            if (!isSelectedPriority() && state.selected === loader.view.itemAtIndex(selectedIndex)) {
+                state.selected = null;
+                return;
+            }
+
             loader.view.currentIndex = selectedIndex;
             loader.view.positionViewAtIndex(selectedIndex, GridView.Contain);
+            syncSelectionState();
         });
     }
 
@@ -134,7 +139,7 @@ IComponent {
                             required property int index
                             width: grid.cellWidth
                             height: chipContent.implicitHeight + Launcher.innerMargin * 2
-                            scale: index === root.selectedIndex ? 1.03 : 0.97
+                            scale: isSelectedPriority() && index === root.selectedIndex ? 1.03 : 0.97
 
                             IRect {
                                 anchors.fill: parent
@@ -155,6 +160,7 @@ IComponent {
                                         anchors.horizontalCenter: parent.horizontalCenter
                                         text: modelData.name
                                         font.pixelSize: Launcher.widgetFontSize * 0.7
+                                        font.bold: isSelectedPriority() && index === selectedIndex
                                         color: index === selectedIndex ? Colors.foreground1 : Colors.foreground2
                                         elide: Text.ElideRight
                                         width: parent.parent.width - Launcher.innerMargin * 2
diff --git a/popups/launcher/components/IComponent.qml b/popups/launcher/components/IComponent.qml
index e06ed98..c7b99b3 100644
--- a/popups/launcher/components/IComponent.qml
+++ b/popups/launcher/components/IComponent.qml
@@ -44,14 +44,26 @@ IRect {
     property var down: () => ({
                 bottom: true
             })
-    property var prev: () => {}
-    property var next: () => {}
+    property var prev: () => ({
+                left: true
+            })
+    property var next: () => ({
+                right: true
+            })
     // true if not closed
     property var exec: () => {}
-    property var home: () => {}
-    property var end: () => {}
-    property var pgup: () => {}
-    property var pgdn: () => {}
+    property var home: () => ({
+                top: true
+            })
+    property var end: () => ({
+                bottom: true
+            })
+    property var pgup: () => ({
+                top: true
+            })
+    property var pgdn: () => ({
+                bottom: true
+            })
 
     signal close
 
@@ -64,6 +76,10 @@ IRect {
         return state.priorities.indexOf(root);
     }
 
+    function isSelectedPriority() {
+        return state.selectedPriority === getSelfPriority();
+    }
+
     function trySetSelfPriority() {
         let self = getSelfPriority();
         // ??? why tf is it -1 not null or undefined this is why rust is better
@@ -106,6 +122,8 @@ IRect {
         onHoveredChanged: {
             if (hovered)
                 root.trySetSelfPriority();
+            else
+                root.syncSelectionState();
         }
     }
 
diff --git a/popups/launcher/components/ISmartCalc.qml b/popups/launcher/components/ISmartCalc.qml
index 2c31f88..ded3c72 100644
--- a/popups/launcher/components/ISmartCalc.qml
+++ b/popups/launcher/components/ISmartCalc.qml
@@ -9,9 +9,9 @@ import qs.config
 import core
 
 IComponent {
-	property string symbol
-	required property bool category
-	required property string predictiveText
+    property string symbol
+    required property bool category
+    required property string predictiveText
 
     property int cursorPosition: SelectionState.cursorPosition
 
@@ -22,14 +22,14 @@ IComponent {
     }
 
     onInputChanged: {
-	   	SmartCalc.reset_result();
-	}
+        SmartCalc.reset_result();
+    }
 
     process: function () {
-	   	SmartCalc.query(input);
-     	const answer = SmartCalc.result;
-		// TODO: use answer property rn its circular dependent since it has to be valid which is the line below
-		const valid = SmartCalc.result && SmartCalc.result.length > 0 && category;
+        SmartCalc.query(input);
+        const answer = SmartCalc.result;
+        // TODO: use answer property rn its circular dependent since it has to be valid which is the line below
+        const valid = SmartCalc.result && SmartCalc.result.length > 0 && category;
         return {
             valid,
             priority: valid,
@@ -60,7 +60,7 @@ IComponent {
                     text: input
                     font {
                         pixelSize: Launcher.widgetFontSize
-                        bold: true
+                        bold: isSelectedPriority()
                     }
                 }
             }
@@ -69,7 +69,7 @@ IComponent {
                 visible: valid
                 text: "→"
                 font.pixelSize: Launcher.widgetFontSize
-                font.bold: true
+                font.bold: isSelectedPriority()
             }
 
             Item {
@@ -83,7 +83,7 @@ IComponent {
                     text: valid ? answer : ''
                     font {
                         pixelSize: Launcher.widgetFontSize
-                        bold: true
+                        bold: isSelectedPriority()
                     }
                 }
             }
diff --git a/popups/launcher/components/Spell.qml b/popups/launcher/components/Spell.qml
index 5e62ae8..5e5d20a 100644
--- a/popups/launcher/components/Spell.qml
+++ b/popups/launcher/components/Spell.qml
@@ -115,6 +115,11 @@ IComponent {
 
     syncSelectionState: function () {
         Qt.callLater(() => {
+            if (!isSelectedPriority() && state.selected === loader.view.itemAtIndex(selectedIndex)) {
+                state.selected = null;
+                return;
+            }
+
             if (!loader.view || selectedIndex < 0 || selectedIndex >= loader.view.count || !root.visible)
                 return;