CalvinBackup/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2026-03-14 06:17:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

🐛 Only select available options not headers or empty mesage

Browse Source
This commit is contained in:
Eva Marco
2026-02-25 11:28:18 +01:00
parent c819241dda
commit 2f0329bbaa
3 changed files with 45 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/app/main/ui/workspace/tokens/management/forms/controls/combobox.cljs
View File

@@ -147,8 +147,8 @@
{:keys [focused-id on-key-down]}
(use-navigation
{:is-open is-open
:options-ref options-ref
:nodes-ref nodes-ref
:options dropdown-options
:toggle-dropdown toggle-dropdown
:is-open* is-open*
:on-enter on-option-enter})

46
frontend/src/app/main/ui/workspace/tokens/management/forms/controls/combobox_navigation.cljs
View File

@@ -23,17 +23,17 @@
(some #(when (focusable-option? %) (:id %)) options))
(defn next-focus-id
[options focused-id direction]
(let [focusable (filter focusable-option? options)
ids (map :id focusable)
[focusables focused-id direction]
(let [ids (vec (map :id focusables))
idx (.indexOf (clj->js ids) focused-id)
idx (if (= idx -1) -1 idx)
next-idx (case direction
:down (min (dec (count ids)) (inc (if (= idx -1) -1 idx)))
:down (min (dec (count ids)) (inc idx))
:up (max 0 (dec (if (= idx -1) 0 idx))))]
(nth ids next-idx nil)))
(defn use-navigation
[{:keys [is-open options-ref nodes-ref is-open* toggle-dropdown on-enter]}]
[{:keys [is-open options nodes-ref is-open* toggle-dropdown on-enter]}]
(let [focused-id* (mf/use-state nil)
focused-id (deref focused-id*)
@@ -48,7 +48,6 @@
esc? (kbd/esc? event)
open-dropdown (kbd/is-key? event "{")
close-dropdown (kbd/is-key? event "}")
options (mf/ref-val options-ref)
options (if (delay? options) @options options)]
(cond
@@ -59,21 +58,22 @@
(cond
is-open
(when (seq focusables)
(let [next-id (next-focus-id options focused-id :down)]
(let [next-id (next-focus-id focusables focused-id :down)]
(reset! focused-id* next-id)))
(seq focusables)
(do
(toggle-dropdown event)
(reset! focused-id* (first-focusable-id focusables)))
:else
nil)))
up?
(when is-open
(dom/prevent-default event)
(let [next-id (next-focus-id options focused-id :up)]
(let [focusables (focusable-options options)
next-id (next-focus-id focusables focused-id :up)]
(reset! focused-id* next-id)))
open-dropdown
@@ -85,8 +85,10 @@
enter?
(do
(dom/prevent-default event)
(when (and is-open focused-id)
(on-enter focused-id)))
(when (and is-open focused-id)
(let [focusables (focusable-options options)]
(when (some #(= (:id %) focused-id) focusables)
(on-enter focused-id)))))
esc?
(do
(dom/prevent-default event)
@@ -94,15 +96,12 @@
:else nil))))]
;; Initial focus on first option
(mf/with-effect [is-open options-ref]
(mf/with-effect [is-open options]
(when is-open
(let [options (mf/ref-val options-ref)
options (if (delay? options) @options options)
first-id (first-focusable-id options)]
(when first-id
(reset! focused-id* first-id)))))
(let [options (if (delay? options) @options options)
focusables (focusable-options options)
first-id (some :id focusables)]
(reset! focused-id* first-id))))
;; auto scroll when key down
(mf/with-effect [focused-id nodes-ref]
@@ -114,5 +113,12 @@
node {:block "nearest"
:inline "nearest"})))))
(mf/with-effect [is-open options]
(when is-open
(let [opts (if (delay? options) @options options)
focusables (focusable-options opts)
first-id (some :id focusables)]
(reset! focused-id* first-id))))
{:focused-id focused-id
:on-key-down on-key-down}))

36
frontend/src/app/main/ui/workspace/tokens/management/forms/controls/utils.cljs
View File

@@ -18,24 +18,24 @@
(->> tokens
(filter (fn [[_ items]] (seq items))))]
(if (empty? non-empty-groups)
[{:type :empty
:label (if no-sets
(tr "ds.inputs.numeric-input.no-applicable-tokens")
(tr "ds.inputs.numeric-input.no-matches"))}]
(->> non-empty-groups
(keep (fn [[type items]]
(when (seq? items)
(cons {:group true
:type :group
:id (dm/str "group-" (name type))
:name (name type)}
(map token->dropdown-option items)))))
(interpose [{:separator true
:id "separator"
:type :separator}])
(apply concat)
(vec)
(not-empty)))))
[{:type :empty
:label (if no-sets
(tr "ds.inputs.numeric-input.no-applicable-tokens")
(tr "ds.inputs.numeric-input.no-matches"))}]
(->> non-empty-groups
(keep (fn [[type items]]
(when (seq? items)
(cons {:group true
:type :group
:id (dm/str "group-" (name type))
:name (name type)}
(map token->dropdown-option items)))))
(interpose [{:separator true
:id "separator"
:type :separator}])
(apply concat)
(vec)
(not-empty)))))
(defn- extract-partial-brace-text
[s]