3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-05-08 19:45:55 +02:00
Code Issues Projects Releases Packages Wiki Activity

💄 Add cosmetic changes to tokens sidebar component

Browse source
This commit is contained in:
Andrey Antukh 2025-02-04 18:03:37 +01:00
parent 7e0b2702de
commit b6e26d15e1
3 changed files with 28 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
frontend/src/app/main/ui/workspace/sidebar.cljs
View file

@ -31,7 +31,7 @@
[app.main.ui.workspace.sidebar.shortcuts :refer [shortcuts-container]]
[app.main.ui.workspace.sidebar.sitemap :refer [sitemap]]
[app.main.ui.workspace.sidebar.versions :refer [versions-toolbox*]]
[app.main.ui.workspace.tokens.sidebar :refer [tokens-sidebar-tab]]
[app.main.ui.workspace.tokens.sidebar :refer [tokens-sidebar-tab*]]
[app.util.debug :as dbg]
[app.util.i18n :refer [tr]]
[potok.v2.core :as ptk]
@ -120,7 +120,7 @@
tokens-tab
(when design-tokens?
(mf/html [:& tokens-sidebar-tab]))
(mf/html [:> tokens-sidebar-tab*]))
tabs
(if ^boolean mode-inspect?

40
frontend/src/app/main/ui/workspace/tokens/sidebar.cljs
View file

@ -254,24 +254,31 @@
:style "header"}])]]
[:& theme-sets-list {:on-open on-open}]]]]))
(mf/defc tokens-tab
[_props]
(let [objects (mf/deref refs/workspace-page-objects)
(mf/defc tokens-tab*
[]
(let [objects (mf/deref refs/workspace-page-objects)
selected (mf/deref refs/selected-shapes)
selected (mf/deref refs/selected-shapes)
selected-shapes (into [] (keep (d/getf objects)) selected)
selected-shapes
(mf/with-memo [selected objects]
(into [] (keep (d/getf objects)) selected))
active-theme-tokens (sd/use-active-theme-sets-tokens)
active-theme-tokens
(sd/use-active-theme-tokens)
tokens (sd/use-resolved-workspace-tokens)
tokens
(sd/use-resolved-workspace-tokens)
selected-token-set-tokens (mf/deref refs/workspace-selected-token-set-tokens)
selected-token-set-tokens
(mf/deref refs/workspace-selected-token-set-tokens)
selected-token-set-name (mf/deref refs/workspace-selected-token-set-name)
selected-token-set-name
(mf/deref refs/workspace-selected-token-set-name)
token-groups (mf/with-memo [tokens selected-token-set-tokens]
(-> (select-keys tokens (keys selected-token-set-tokens))
(sorted-token-groups)))]
token-groups
(mf/with-memo [tokens selected-token-set-tokens]
(-> (select-keys tokens (keys selected-token-set-tokens))
(sorted-token-groups)))]
[:*
[:& token-context-menu]
[:& title-bar {:all-clickable true
@ -357,10 +364,9 @@
:on-click on-export}
(tr "labels.export")]]]))
(mf/defc tokens-sidebar-tab
{::mf/wrap [mf/memo]
::mf/wrap-props false}
[_props]
(mf/defc tokens-sidebar-tab*
{::mf/wrap [mf/memo]}
[]
(let [{on-pointer-down-pages :on-pointer-down
on-lost-pointer-capture-pages :on-lost-pointer-capture
on-pointer-move-pages :on-pointer-move
@ -374,5 +380,5 @@
:on-pointer-down on-pointer-down-pages
:on-lost-pointer-capture on-lost-pointer-capture-pages
:on-pointer-move on-pointer-move-pages}]
[:& tokens-tab]]
[:> tokens-tab*]]
[:& import-export-button]]))

4
frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs
View file

@ -295,6 +295,8 @@
prefer-selected-token-set-tokens (merge active-theme-tokens selected-token-set-tokens)]
(use-resolved-tokens prefer-selected-token-set-tokens)))
(defn use-active-theme-sets-tokens []
(defn use-active-theme-tokens
"A hook that returns active tokens for the current active theme"
[]
(-> (mf/deref refs/workspace-active-theme-sets-tokens)
(use-resolved-tokens {:cache-atom !theme-tokens-cache})))