From e8b87b0db1092bb4935c2a7e4b3db1443753c595 Mon Sep 17 00:00:00 2001
From: Pablo Alba <pablo.alba@kaleidos.net>
Date: Wed, 17 May 2023 13:31:02 +0200
Subject: [PATCH] :bug: Fix zooming while color picker breaks UI

---
 CHANGES.md                                                  | 6 ++++++
 frontend/src/app/main/ui/workspace/viewport/actions.cljs    | 5 +++--
 .../src/app/main/ui/workspace/viewport/pixel_overlay.cljs   | 3 ++-
 version.txt                                                 | 2 +-
 4 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/CHANGES.md b/CHANGES.md
index b6f20465a..57c749035 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -1,5 +1,11 @@
 # CHANGELOG
 
+## 1.18.4
+
+### :bug: Bugs fixed
+
+- Fix zooming while color picker breaks UI [GH #3214](https://github.com/penpot/penpot/issues/3214)
+
 ## 1.18.3
 
 ### :bug: Bugs fixed
diff --git a/frontend/src/app/main/ui/workspace/viewport/actions.cljs b/frontend/src/app/main/ui/workspace/viewport/actions.cljs
index eef5890df..821ab50c6 100644
--- a/frontend/src/app/main/ui/workspace/viewport/actions.cljs
+++ b/frontend/src/app/main/ui/workspace/viewport/actions.cljs
@@ -361,9 +361,10 @@
    (fn [event]
      (let [event  (.getBrowserEvent ^js event)
            target (dom/get-target event)
-           mod? (kbd/mod? event)]
+           mod? (kbd/mod? event)
+           picking-color? (= "pixel-overlay" (.-id target))]
 
-       (when (uwvv/inside-viewport? target)
+       (when (or (uwvv/inside-viewport? target) picking-color?)
          (dom/prevent-default event)
          (dom/stop-propagation event)
          (let [raw-pt (dom/get-client-position event)
diff --git a/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs b/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs
index ceab081f3..9e5d95369 100644
--- a/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs
+++ b/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs
@@ -183,7 +183,8 @@
 
     [:*
      [:div.pixel-overlay
-      {:tab-index 0
+      {:id "pixel-overlay"
+       :tab-index 0
        :style {:cursor cur/picker}
        :on-pointer-down handle-pointer-down-picker
        :on-pointer-up handle-pointer-up-picker
diff --git a/version.txt b/version.txt
index b9fb27ab4..a67b05e87 100644
--- a/version.txt
+++ b/version.txt
@@ -1 +1 @@
-1.18.3
+1.18.4