Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-07 15:39:42 -05:00
Code Issues Activity

Show checkmark for applied tokens

Browse source
This commit is contained in:
Florian Schroedl 2024-06-03 15:21:08 +02:00
parent 65942ef63b
commit 580076355b
2 changed files with 27 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
frontend/src/app/main/ui/workspace/tokens/context_menu.cljs
View file

@ -64,15 +64,17 @@
:token-type-props updated-token-type-props :token-type-props updated-token-type-props
:selected-shapes selected-shapes}))) :selected-shapes selected-shapes})))
(defn additional-actions [{:keys [token-id token-type selected-shapes] :as context-data}]
(defn additional-actions [{:keys [token-type] :as context-data}]
(let [attributes->actions (fn [update-fn coll] (let [attributes->actions (fn [update-fn coll]
(for [{:keys [attributes] :as item} coll] (for [{:keys [attributes] :as item} coll]
(assoc item :action #(update-fn context-data attributes))))] (let [selected? (wtc/tokens-applied? {:id token-id} selected-shapes attributes)]
(assoc item
:action #(update-fn context-data attributes)
:selected? selected?))))]
(case token-type (case token-type
:border-radius (attributes->actions :border-radius (attributes->actions
apply-border-radius-token apply-border-radius-token
[{:title "All" :attributes #{:all}} [{:title "All" :attributes #{:r1 :r2 :r3 :r4}}
{:title "Top Left" :attributes #{:r1}} {:title "Top Left" :attributes #{:r1}}
{:title "Top Right" :attributes #{:r2}} {:title "Top Right" :attributes #{:r2}}
{:title "Bottom Right" :attributes #{:r3}} {:title "Bottom Right" :attributes #{:r3}}
@ -111,8 +113,14 @@
(mf/defc token-pill-context-menu (mf/defc token-pill-context-menu
[context-data] [context-data]
(let [menu-entries (generate-menu-entries context-data)] (let [menu-entries (generate-menu-entries context-data)]
(for [[index entry] (d/enumerate menu-entries)] (for [[index {:keys [title action selected?]}] (d/enumerate menu-entries)]
[:& menu-entry {:title (:title entry) :on-click (:action entry) :key index}]))) [:& menu-entry {:key index
:title title
:on-click action
;; TODO: Allow selected items wihtout an icon for the context menu
:icon (mf/html [:div {:class (stl/css-case :empty-icon true
:hidden-icon (not selected?))}])
:selected? selected?}])))
(mf/defc token-context-menu (mf/defc token-context-menu
[] []

15
frontend/src/app/main/ui/workspace/tokens/context_menu.scss
View file

@ -24,8 +24,19 @@
background-color: var(--menu-background-color); background-color: var(--menu-background-color);
max-height: 100vh; max-height: 100vh;
overflow-y: auto; overflow-y: auto;
// TODO: Fixes missing styles from parent context menu
li {
@include bodySmallTypography;
color: var(--menu-foreground-color);
}
} }
.token-context-submenu { // TODO: Allow selected items wihtout an icon for the context menu
position: absolute; .empty-icon {
width: 0;
height: 0;
}
.hidden-icon {
width: 11px;
} }