From fae488b15aa852b87e00b4de2feb6f2ce34cfa3a Mon Sep 17 00:00:00 2001
From: Pablo Alba <pablo.alba@kaleidos.net>
Date: Fri, 21 Nov 2025 17:51:12 +0100
Subject: [PATCH] :bug: Fix after changing a variant property value, the value
 appears as empty (#7791)

---
 frontend/src/app/main/ui/ds/controls/combobox.cljs  | 13 ++++++++++---
 .../workspace/sidebar/options/menus/component.cljs  | 12 ++++++++++--
 2 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/frontend/src/app/main/ui/ds/controls/combobox.cljs b/frontend/src/app/main/ui/ds/controls/combobox.cljs
index 2f09761ae5..f8fcc566b6 100644
--- a/frontend/src/app/main/ui/ds/controls/combobox.cljs
+++ b/frontend/src/app/main/ui/ds/controls/combobox.cljs
@@ -61,6 +61,7 @@
         nodes-ref    (mf/use-ref nil)
         options-ref  (mf/use-ref nil)
         listbox-id   (mf/use-id)
+        value-ref    (mf/use-ref nil)
 
         dropdown-options
         (mf/with-memo [options filter-id]
@@ -200,11 +201,10 @@
            (let [value (-> event
                            dom/get-target
                            dom/get-value)]
+             (mf/set-ref-val! value-ref value)
              (reset! selected-id* value)
              (reset! filter-id* value)
-             (reset! focused-id* nil)
-             (when (fn? on-change)
-               (on-change value)))))
+             (reset! focused-id* nil))))
 
         selected-option
         (mf/with-memo [options selected-id]
@@ -223,6 +223,13 @@
      (fn []
        (reset! selected-id* default-selected)))
 
+    ;; On componnet unmount, save the new value if needed
+    (mf/with-effect [on-change]
+      (fn []
+        (when-let [value (mf/ref-val value-ref)]
+          (mf/set-ref-val! value-ref nil)
+          (on-change value))))
+
     [:div {:ref combobox-ref
            :class (stl/css-case
                    :wrapper true
diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.cljs
index 3144897f2c..42f7456ba0 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/component.cljs
@@ -309,6 +309,13 @@
                  to-space-between-pos (if (= relative-pos :bot) (inc pos) pos)]
              (on-reorder from-pos to-space-between-pos))))
 
+
+        on-prop-value-change
+        (mf/use-fn
+         (mf/deps on-prop-value-change pos)
+         (fn [value]
+           (on-prop-value-change pos value)))
+
         [dprops dref]
         (h/use-sortable
          :data-type "penpot/variant-property"
@@ -350,7 +357,8 @@
                            (get :objects))
 
         props-list     (map :variant-properties components)
-        component-ids  (map :id components)
+        component-ids  (mf/with-memo [components]
+                         (map :id components))
         properties     (if (> (count component-ids) 1)
                          (ctv/compare-properties props-list false)
                          (first props-list))
@@ -413,7 +421,7 @@
                                           :prop prop
                                           :options (get-options (:name prop))
                                           :on-prop-name-blur update-property-name
-                                          :on-prop-value-change (partial update-property-value pos)
+                                          :on-prop-value-change update-property-value
                                           :on-reorder reorder-properties}])]]
 
      (if malformed-msg