From 71d511abd888b427cad4543a0d21b9616b537169 Mon Sep 17 00:00:00 2001
From: Sergej-Vlasov <37613182+Sergej-Vlasov@users.noreply.github.com>
Date: Thu, 6 Nov 2025 10:27:26 +0000
Subject: [PATCH] VariableControls: Adjust variable selection in edit mode
 (#113408)

* adjust variable selection logic

* clean up

* adjust attribute used
---
 .../dashboard-scene/scene/VariableControls.tsx     | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/public/app/features/dashboard-scene/scene/VariableControls.tsx b/public/app/features/dashboard-scene/scene/VariableControls.tsx
index f62d8b06c41..eba51280522 100644
--- a/public/app/features/dashboard-scene/scene/VariableControls.tsx
+++ b/public/app/features/dashboard-scene/scene/VariableControls.tsx
@@ -56,10 +56,16 @@ export function VariableValueSelectWrapper({ variable, inMenu }: VariableSelectP
     }
 
     // Ignore click if it's inside the value control
-    if (evt.target instanceof Element && !evt.target.closest(`label`)) {
-      // Prevent clearing selection when clicking inside value
-      evt.stopPropagation();
-      return;
+    if (evt.target instanceof Element) {
+      // multi variable options contain label element so we need a more specific
+      //  condition to target variable label to prevent edit pane selection on option click
+      const forAttribute = evt.target.closest('label[for]')?.getAttribute('for');
+
+      if (!(forAttribute === `var-${variable.state.key || ''}`)) {
+        // Prevent clearing selection when clicking inside value
+        evt.stopPropagation();
+        return;
+      }
     }
 
     if (isSelectable && onSelect) {