🐛 Fix colorpicker scroll when dropdown displayed

CHANGES.md

@@ -5,6 +5,7 @@
 ### :bug: Bugs fixed
 
 - Fix webhooks not shown in list [Taiga #10763](https://tree.taiga.io/project/penpot/issue/10763)
+- Fix colorpicker scroll when dropdown displayed [Taiga #10696](https://tree.taiga.io/project/penpot/issue/10696)
 
 ## 2.6.0
 

frontend/src/app/main/ui/components/select.cljs

@@ -23,7 +23,7 @@
     [item item item]))
 
 (mf/defc select
-  [{:keys [default-value options class dropdown-class is-open? on-change on-pointer-enter-option on-pointer-leave-option disabled]}]
+  [{:keys [default-value options class dropdown-class is-open? on-change on-pointer-enter-option on-pointer-leave-option disabled data-direction]}]
   (let [label-index    (mf/with-memo [options]
                          (into {} (map as-key-value) options))
 
@@ -112,7 +112,7 @@
        [:span {:class (stl/css :current-label)} current-label]
        [:span {:class (stl/css :dropdown-button)} i/arrow]
        [:& dropdown {:show is-open? :on-close close-dropdown}
-        [:ul {:ref dropdown-element* :data-direction @dropdown-direction*
+        [:ul {:ref dropdown-element* :data-direction (or data-direction @dropdown-direction*)
               :class (dm/str dropdown-class " " (stl/css :custom-select-dropdown))}
          (for [[index item] (d/enumerate options)]
            (if (= :separator item)

frontend/src/app/main/ui/workspace/colorpicker.scss

@@ -20,7 +20,7 @@
 
 .colorpicker {
   border-radius: $br-8;
-  overflow: auto;
+  overflow: hidden;
 }
 
 .colorpicker-tabs {

frontend/src/app/main/ui/workspace/colorpicker/libraries.cljs

@@ -124,6 +124,7 @@
      [:div {:class (stl/css :select-wrapper)}
       [:& select
        {:class (stl/css :shadow-type-select)
+        :data-direction "up"
         :default-value (or (d/name selected) "recent")
         :options options
         :on-change on-library-change}]]