3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-07-26 10:07:13 +02:00
Code Issues Projects Releases Packages Wiki Activity

🐛 Fix combobox dropdown visibility when no options are provided (#9753)

Browse source
This commit is contained in:
Juanfran 2025-01-30 09:45:38 +01:00
parent 8f48396556
commit c5644a5fe8
2 changed files with 14 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

24
frontend/src/app/main/ui/ds/controls/combobox.cljs
View file

@ -9,6 +9,7 @@
[app.common.data.macros :as dm] [app.common.data.macros :as dm]
[app.main.style :as stl]) [app.main.style :as stl])
(:require (:require
[app.common.data :as d]
[app.main.ui.ds.controls.shared.options-dropdown :refer [options-dropdown*]] [app.main.ui.ds.controls.shared.options-dropdown :refer [options-dropdown*]]
[app.main.ui.ds.foundations.assets.icon :refer [icon* icon-list] :as i] [app.main.ui.ds.foundations.assets.icon :refer [icon* icon-list] :as i]
[app.util.array :as array] [app.util.array :as array]
@ -242,17 +243,18 @@
:on-change on-input-change :on-change on-input-change
:on-key-down on-key-down}]] :on-key-down on-key-down}]]
[:> :button {:type "button" (when (d/not-empty? options)
:tab-index "-1" [:> :button {:type "button"
:aria-expanded open :tab-index "-1"
:aria-controls listbox-id :aria-expanded open
:class (stl/css :button-toggle-list) :aria-controls listbox-id
:on-click on-click} :class (stl/css :button-toggle-list)
[:> icon* {:icon-id i/arrow :on-click on-click}
:class (stl/css :arrow) [:> icon* {:icon-id i/arrow
:size "s" :class (stl/css :arrow)
:aria-hidden true :size "s"
:data-testid "combobox-open-button"}]]] :aria-hidden true
:data-testid "combobox-open-button"}]])]
(when (and open (seq dropdown-options)) (when (and open (seq dropdown-options))
[:> options-dropdown* {:on-click on-option-click [:> options-dropdown* {:on-click on-option-click

2
frontend/src/app/main/ui/ds/controls/combobox.scss
View file

@ -46,7 +46,7 @@
.focused { .focused {
--combobox-outline-color: var(--color-accent-primary); --combobox-outline-color: var(--color-accent-primary);
--combobox-bg-color: var(--color-background-secondary); --combobox-bg-color: var(--color-background-primary);
} }
.arrow { .arrow {