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

Always render ungroupd themes first

Browse source
This commit is contained in:
Florian Schroedl 2024-08-26 16:33:07 +02:00
parent 0d2d1a8b8a
commit 1d599cbf7d
1 changed files with 29 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

45
frontend/src/app/main/ui/workspace/tokens/theme_select.cljs
View file

@ -17,29 +17,42 @@
[app.util.dom :as dom] [app.util.dom :as dom]
[rumext.v2 :as mf])) [rumext.v2 :as mf]))
(mf/defc list-items
[{:keys [themes active-theme-ids on-close grouped?]}]
(when (seq themes)
[:ul
(for [{:keys [id name]} themes
:let [selected? (get active-theme-ids id)]]
[:li {:key id
:class (stl/css-case
:checked-element true
:sub-item grouped?
:is-selected selected?)
:on-click (fn [e]
(dom/stop-propagation e)
(st/emit! (wdt/toggle-token-theme id))
(on-close))}
[:span {:class (stl/css :label)} name]
[:span {:class (stl/css :check-icon)} i/tick]])]))
(mf/defc theme-options (mf/defc theme-options
[{:keys [on-close]}] [{:keys [on-close]}]
(let [active-theme-ids (mf/deref refs/workspace-active-theme-ids) (let [active-theme-ids (mf/deref refs/workspace-active-theme-ids)
ordered-themes (mf/deref refs/workspace-ordered-token-themes)] ordered-themes (mf/deref refs/workspace-ordered-token-themes)
grouped-themes (dissoc ordered-themes nil)
ungrouped-themes (get ordered-themes nil)]
[:ul [:ul
(for [[group themes] ordered-themes] [:& list-items {:themes ungrouped-themes
:active-theme-ids active-theme-ids
:on-close on-close}]
(for [[group themes] grouped-themes]
[:li {:key group} [:li {:key group}
(when group (when group
[:span {:class (stl/css :group)} group]) [:span {:class (stl/css :group)} group])
[:ul [:& list-items {:themes themes
(for [{:keys [id name]} themes :active-theme-ids active-theme-ids
:let [selected? (get active-theme-ids id)]] :on-close on-close
[:li {:key id :grouped? true}]])
:class (stl/css-case
:checked-element true
:sub-item true
:is-selected selected?)
:on-click (fn [e]
(dom/stop-propagation e)
(st/emit! (wdt/toggle-token-theme id))
(on-close))}
[:span {:class (stl/css :label)} name]
[:span {:class (stl/css :check-icon)} i/tick]])]])
[:li {:class (stl/css-case :checked-element true [:li {:class (stl/css-case :checked-element true
:checked-element-button true) :checked-element-button true)
:on-click #(modal/show! :tokens/themes {})} :on-click #(modal/show! :tokens/themes {})}