mirror of
https://github.com/logseq/logseq.git
synced 2026-05-20 10:52:38 +00:00
fix(ux): incorrect keyboard navigation for installed themes
This commit is contained in:
@@ -13,7 +13,6 @@
|
||||
[frontend.handler.plugin :as plugin-handler]
|
||||
[frontend.handler.plugin-config :as plugin-config-handler]
|
||||
[frontend.handler.ui :as ui-handler]
|
||||
[frontend.mixins :as mixins]
|
||||
[frontend.rum :as rum-utils]
|
||||
[frontend.search :as search]
|
||||
[frontend.state :as state]
|
||||
@@ -30,6 +29,28 @@
|
||||
|
||||
(def *dirties-toggle-items (atom {}))
|
||||
|
||||
(defn- handle-installed-themes-key-down
|
||||
[*cursor *total ^js target ^js e]
|
||||
(case (.-keyCode e)
|
||||
38 ;; up
|
||||
(do
|
||||
(util/stop e)
|
||||
(reset! *cursor
|
||||
(if (zero? @*cursor)
|
||||
(dec @*total) (dec @*cursor))))
|
||||
40 ;; down
|
||||
(do
|
||||
(util/stop e)
|
||||
(reset! *cursor
|
||||
(if (= @*cursor (dec @*total))
|
||||
0 (inc @*cursor))))
|
||||
13 ;; enter
|
||||
(do
|
||||
(util/stop e)
|
||||
(when-let [^js active (.querySelector target ".is-active")]
|
||||
(.click active)))
|
||||
nil))
|
||||
|
||||
(defn- clear-dirties-states!
|
||||
[]
|
||||
(reset! *dirties-toggle-items {}))
|
||||
@@ -86,32 +107,16 @@
|
||||
(reset! *themes themes)
|
||||
(reset! *total (count themes))
|
||||
state))}
|
||||
(mixins/event-mixin
|
||||
(fn [state]
|
||||
(let [*cursor (::cursor state)
|
||||
*total (::total state)
|
||||
^js target (rum/dom-node state)]
|
||||
(.focus target)
|
||||
(mixins/on-key-down
|
||||
state {38 ;; up
|
||||
(fn [^js _e]
|
||||
(reset! *cursor
|
||||
(if (zero? @*cursor)
|
||||
(dec @*total) (dec @*cursor))))
|
||||
40 ;; down
|
||||
(fn [^js _e]
|
||||
(reset! *cursor
|
||||
(if (= @*cursor (dec @*total))
|
||||
0 (inc @*cursor))))
|
||||
|
||||
13 ;; enter
|
||||
#(when-let [^js active (.querySelector target ".is-active")]
|
||||
(.click active))}))))
|
||||
{:did-mount (fn [state]
|
||||
(some-> (rum/dom-node state) (.focus))
|
||||
state)}
|
||||
[state]
|
||||
(let [*cursor (::cursor state)
|
||||
*themes (::themes state)]
|
||||
*themes (::themes state)
|
||||
*total (::total state)]
|
||||
[:div.cp__themes-installed
|
||||
{:tab-index -1}
|
||||
{:tab-index -1
|
||||
:on-key-down #(handle-installed-themes-key-down *cursor *total (.-currentTarget %) %)}
|
||||
[:h1.mb-4.text-2xl.p-1 (t :nav/themes)]
|
||||
(map-indexed
|
||||
(fn [idx opt]
|
||||
|
||||
Reference in New Issue
Block a user