Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-21 06:02:32 -05:00
Code Issues Activity

Sets sidebar

Browse source
This commit is contained in:
Florian Schroedl 2024-09-20 14:27:19 +02:00
parent 501256f16b
commit f5249196f9
8 changed files with 96 additions and 59 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs
View file

@ -857,7 +857,7 @@
shape (when-not multiple
(first (deref (refs/objects-by-id ids))))
tokens (mf/deref refs/workspace-selected-token-set-tokens)
spacing-tokens (mf/use-memo (mf/deps tokens) #(:spacing (wtc/group-tokens-by-type tokens)))
spacing-tokens (mf/use-memo (mf/deps tokens) #(:spacing (wtc/group-tokens-by-type-OLD tokens)))
spacing-column-options (mf/use-memo
(mf/deps shape spacing-tokens)

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

@ -103,7 +103,7 @@
tokens (-> (mf/deref refs/workspace-active-theme-sets-tokens)
(sd/use-resolved-tokens))
tokens-by-type (mf/use-memo (mf/deps tokens) #(wtc/group-tokens-by-type tokens))
tokens-by-type (mf/use-memo (mf/deps tokens) #(wtc/group-tokens-by-type-OLD tokens))
border-radius-tokens (:border-radius tokens-by-type)
border-radius-options (mf/use-memo

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

@ -11,7 +11,8 @@
[app.main.ui.workspace.tokens.token :as wtt]
[app.util.dom :as dom]
[app.util.webapi :as wapi]
[cuerdas.core :as str]))
[cuerdas.core :as str]
[app.common.data.macros :as dm]))
;; Helpers ---------------------------------------------------------------------
@ -29,6 +30,13 @@
(->> (vals tokens)
(group-by :type)))
(dm/legacy
(defn group-tokens-by-type-OLD
"Groups tokens by their `:type` property."
[tokens]
(->> (vals tokens)
(group-by :type))))
(defn tokens-name-map->select-options [{:keys [shape tokens attributes selected-attributes]}]
(->> (wtt/token-names-map tokens)
(map (fn [[_k {:keys [name] :as item}]]

2
frontend/src/app/main/ui/workspace/tokens/sets.cljs
View file

@ -72,7 +72,7 @@
on-cancel]
:as _props}]
(let [{:keys [id name _children]} token-set
selected? (and set? (token-set-selected? id))
selected? (and set? (token-set-selected? name))
visible? (token-set-active? id)
collapsed? (mf/use-state false)
set? true #_(= type :set)

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

@ -241,7 +241,6 @@
selected (mf/deref refs/selected-shapes)
selected-shapes (into [] (keep (d/getf objects)) selected)
active-theme-tokens (sd/use-active-theme-sets-tokens)
tokens (sd/use-resolved-workspace-tokens)

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

@ -72,34 +72,34 @@
(defn resolve-tokens+
[tokens & {:keys [names-map?] :as config}]
(p/let [sd-tokens (-> (wtt/token-names-tree tokens)
(resolve-sd-tokens+))]
(let [resolved-tokens (reduce
(fn [acc ^js cur]
(let [identifier (if names-map?
(.. cur -original -name)
(uuid (.-uuid (.-id cur))))
{:keys [type] :as origin-token} (get tokens identifier)
value (.-value cur)
token-or-err (case type
:color (if-let [tc (tinycolor/valid-color value)]
{:value value :unit (tinycolor/color-format tc)}
{:errors [(wte/error-with-value :error.token/invalid-color value)]})
(or (wtt/parse-token-value value)
(if-let [references (-> (wtt/find-token-references value)
(seq))]
{:errors [(wte/error-with-value :error.style-dictionary/missing-reference references)]
:references references}
{:errors [(wte/error-with-value :error.style-dictionary/invalid-token-value value)]})))
output-token (if (:errors token-or-err)
(merge origin-token token-or-err)
(assoc origin-token
:resolved-value (:value token-or-err)
:unit (:unit token-or-err)))]
(assoc acc (wtt/token-identifier output-token) output-token)))
{} sd-tokens)]
(l/debug :hint "Resolved tokens" :js/tokens resolved-tokens)
resolved-tokens)))
(let [{:keys [tree ids-map]} (wtt/token-names-tree-id-map tokens)]
(p/let [sd-tokens (resolve-sd-tokens+ tree)]
(let [resolved-tokens (reduce
(fn [acc ^js cur]
(let [identifier (if names-map?
(.. cur -original -name)
(uuid (.-uuid (.-id cur))))
{:keys [type] :as origin-token} (get ids-map identifier)
value (.-value cur)
token-or-err (case type
:color (if-let [tc (tinycolor/valid-color value)]
{:value value :unit (tinycolor/color-format tc)}
{:errors [(wte/error-with-value :error.token/invalid-color value)]})
(or (wtt/parse-token-value value)
(if-let [references (-> (wtt/find-token-references value)
(seq))]
{:errors [(wte/error-with-value :error.style-dictionary/missing-reference references)]
:references references}
{:errors [(wte/error-with-value :error.style-dictionary/invalid-token-value value)]})))
output-token (if (:errors token-or-err)
(merge origin-token token-or-err)
(assoc origin-token
:resolved-value (:value token-or-err)
:unit (:unit token-or-err)))]
(assoc acc (wtt/token-identifier output-token) output-token)))
{} sd-tokens)]
(l/debug :hint "Resolved tokens" :js/tokens resolved-tokens)
resolved-tokens))))
;; Hooks -----------------------------------------------------------------------
@ -125,7 +125,9 @@
(let [cached (get @cache-atom tokens)]
(cond
;; The tokens are already processing somewhere
(p/promise? cached) (p/then cached #(reset! tokens-state %))
(p/promise? cached) (-> cached
(p/then #(reset! tokens-state %))
#_(p/catch js/console.error))
;; Get the cached entry
(some? cached) (reset! tokens-state cached)
;; No cached entry, start processing

36
frontend/src/app/main/ui/workspace/tokens/token.cljs
View file

@ -1,9 +1,10 @@
(ns app.main.ui.workspace.tokens.token
(:require
[app.common.data :as d]
[app.common.data.macros :as dm]
[app.main.ui.workspace.tokens.tinycolor :as tinycolor]
[clojure.set :as set]
[cuerdas.core :as str]
[app.main.ui.workspace.tokens.tinycolor :as tinycolor]))
[cuerdas.core :as str]))
(defn get-workspace-tokens
[state]
@ -117,15 +118,32 @@
(->> (map (fn [{:keys [name] :as token}] [name token]) tokens)
(into {})))
(defn token-names-tree
"Convert tokens into a nested tree with their `:name` as the path."
[tokens]
(defonce a (atom nil))
(defn token-names-tree-id-map [tokens]
(reset! a tokens)
(reduce
(fn [acc [_ {:keys [name] :as token}]]
(fn [acc {:keys [name] :as token}]
(when (string? name)
(let [path (token-name->path name)]
(assoc-in acc path token))))
{} tokens))
(let [temp-id (random-uuid)
token (assoc token :temp/id temp-id)]
(-> acc
(assoc-in (concat [:tree] (token-name->path name)) token)
(assoc-in [:ids-map temp-id] token)))))
{:tree {}
:ids-map {}}
tokens))
(dm/legacy
(defn token-names-tree
"Convert tokens into a nested tree with their `:name` as the path."
[tokens]
(reduce
(fn [acc [_ {:keys [name] :as token}]]
(when (string? name)
(let [path (token-name->path name)]
(assoc-in acc path token))))
{} tokens)))
(defn token-name-path-exists?
"Traverses the path from `token-name` down a `token-tree` and checks if a token at that path exists.

42
frontend/src/app/main/ui/workspace/tokens/token_set.cljs
View file

@ -2,7 +2,11 @@
(:require
[app.common.data :refer [ordered-map]]
[app.main.ui.workspace.tokens.token :as wtt]
[clojure.set :as set]))
[clojure.set :as set]
[app.common.types.tokens-lib :as ctob]))
(defn get-workspace-tokens-lib [state]
(get-in state [:workspace-data :tokens-lib]))
;; Themes ----------------------------------------------------------------------
@ -146,21 +150,6 @@
(-> (get-token-set set-id state)
:tokens))
(defn get-selected-token-set-id [state]
(or (get-in state [:workspace-local :selected-token-set-id])
(get-in state [:workspace-data :token-set-groups 0])))
(defn get-selected-token-set [state]
(when-let [id (get-selected-token-set-id state)]
(get-token-set id state)))
(defn get-selected-token-set-tokens [state]
(when-let [token-set (get-selected-token-set state)]
(let [tokens (or (wtt/get-workspace-tokens state) {})]
(select-keys tokens (:tokens token-set)))))
(defn assoc-selected-token-set-id [state id]
(assoc-in state [:workspace-local :selected-token-set-id] id))
(defn get-active-theme-sets-tokens-names-map [state]
(let [active-set-ids (get-ordered-active-set-ids state)]
@ -174,3 +163,24 @@
acc))
names-map-acc token-ids)))
(ordered-map) active-set-ids)))
;; === Set selection
(defn get-selected-token-set-id [state]
(or (get-in state [:workspace-local :selected-token-set-id])
(some-> (get-workspace-tokens-lib state)
(ctob/get-sets)
(first)
(:name))))
(defn get-selected-token-set [state]
(when-let [id (get-selected-token-set-id state)]
(some-> (get-workspace-tokens-lib state)
(ctob/get-set id))))
(defn get-selected-token-set-tokens [state]
(some-> (get-selected-token-set state)
(ctob/get-tokens)))
(defn assoc-selected-token-set-id [state id]
(assoc-in state [:workspace-local :selected-token-set-id] id))