Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-22 14:39:45 -05:00
Code Issues Activity

Apply tokens directly to shape

Browse source
This commit is contained in:
Florian Schroedl 2024-05-16 09:33:20 +02:00
parent cdca00a986
commit c60c5ac34f
3 changed files with 19 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
frontend/src/app/main/data/tokens.cljs
View file

@ -55,19 +55,23 @@
(->> (map (fn [attr] [attr token-id]) attributes) (->> (map (fn [attr] [attr token-id]) attributes)
(into {}))) (into {})))
(defn apply-token-id [{:keys [shape token-id attributes]}] (defn apply-token-id-to-attributes [{:keys [shape token-id attributes]}]
(let [token (token-from-attributes token-id attributes)] (let [token (token-from-attributes token-id attributes)]
(toggle-or-apply-token shape token))) (toggle-or-apply-token shape token)))
(defn apply-token-to-shape [{:keys [shape _token-id _attributes] :as props}]
(let [applied-tokens (apply-token-id-to-attributes props)]
(update shape :applied-tokens #(merge % applied-tokens))))
(defn update-token-from-attributes (defn update-token-from-attributes
[{:keys [token-id shape-id attributes]}] [{:keys [token-id shape-id attributes]}]
(ptk/reify ::update-token-from-attributes (ptk/reify ::update-token-from-attributes
ptk/WatchEvent ptk/WatchEvent
(watch [_ state _] (watch [_ state _]
(let [shape (get-shape-from-state shape-id state) (let [shape (get-shape-from-state shape-id state)
applied-tokens (apply-token-id {:shape shape applied-tokens (apply-token-id-to-attributes {:shape shape
:token-id token-id :token-id token-id
:attributes attributes})] :attributes attributes})]
(rx/of (update-shape shape-id {:applied-tokens applied-tokens})))))) (rx/of (update-shape shape-id {:applied-tokens applied-tokens}))))))
(defn add-token (defn add-token

14
frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs
View file

@ -262,7 +262,7 @@
(update-fn shape) (update-fn shape)
shape)) shape))
{:reg-objects? true {:reg-objects? true
:attrs [:rx :ry :r1 :r2 :r3 :r4]}))) :attrs [:rx :ry :r1 :r2 :r3 :r4 :applied-tokens]})))
on-switch-to-radius-1 on-switch-to-radius-1
(mf/use-fn (mf/use-fn
@ -293,12 +293,14 @@
(fn [value] (fn [value]
(let [token (when (symbol? value) (let [token (when (symbol? value)
(get border-radius-tokens (str value))) (get border-radius-tokens (str value)))
token-value (wtc/resolve-token-value token)] token-value (some-> token wtc/resolve-token-value)]
(st/emit! (st/emit!
(dt/update-token-from-attributes {:token-id (:id token) (change-radius (fn [shape]
:shape-id (first ids) (cond-> shape
:attributes (get-in wtc/token-types [:border-radius :attributes])}) token-value (#(dt/apply-token-to-shape {:token-id (:id token)
(change-radius #(ctsr/set-radius-1 % (or token-value value))))))) :shape %
:attributes (wtc/token-attributes :border-radius)}))
:always (ctsr/set-radius-1 (or token-value value)))))))))
on-radius-multi-change on-radius-multi-change
(mf/use-fn (mf/use-fn

3
frontend/src/app/main/ui/workspace/tokens/core.cljs
View file

@ -188,3 +188,6 @@
{:label "Paragraph Indent" :key :paragraph-indent} {:label "Paragraph Indent" :key :paragraph-indent}
{:label "Text Decoration" :key :text-decoration} {:label "Text Decoration" :key :text-decoration}
{:label "Text Case" :key :text-case}]}}])) {:label "Text Case" :key :text-case}]}}]))
(defn token-attributes [token-type]
(get-in token-types [token-type :attributes]))