diff --git a/frontend/src/app/main/data/tokens.cljs b/frontend/src/app/main/data/tokens.cljs index 0fae9ee93..26a1259b8 100644 --- a/frontend/src/app/main/data/tokens.cljs +++ b/frontend/src/app/main/data/tokens.cljs @@ -16,12 +16,12 @@ [app.main.data.workspace.shapes :as dwsh] [app.main.refs :as refs] [app.main.ui.workspace.tokens.token :as wtt] + [app.main.ui.workspace.tokens.token-set :as wtts] + [app.main.ui.workspace.tokens.update :as wtu] [beicon.v2.core :as rx] [clojure.data :as data] [cuerdas.core :as str] - [potok.v2.core :as ptk] - [app.main.ui.workspace.tokens.changes :as wdt] - [app.main.ui.workspace.tokens.token-set :as wtts])) + [potok.v2.core :as ptk])) ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; ;; Helpers @@ -126,7 +126,9 @@ new-themes (wtts/toggle-active-theme-id token-theme-id state) changes (-> (pcb/empty-changes it) (pcb/update-active-token-themes new-themes themes))] - (rx/of (dch/commit-changes changes)))))) + (rx/of + (dch/commit-changes changes) + (wtu/update-workspace-tokens)))))) (defn delete-token-theme [token-theme-id] (ptk/reify ::delete-token-theme @@ -136,7 +138,9 @@ changes (-> (pcb/empty-changes it) (pcb/with-library-data data) (pcb/delete-token-theme token-theme-id))] - (rx/of (dch/commit-changes changes)))))) + (rx/of + (dch/commit-changes changes) + (wtu/update-workspace-tokens)))))) (defn create-token-set [token-set] (let [new-token-set (merge @@ -165,7 +169,9 @@ (wtts/toggle-token-set-to-token-theme token-set-id theme) theme) (pcb/update-active-token-themes #{(wtts/update-theme-id state)} (wtts/get-active-theme-ids state)))] - (rx/of (dch/commit-changes changes)))))) + (rx/of + (dch/commit-changes changes) + (wtu/update-workspace-tokens)))))) (defn delete-token-set [token-set-id] (ptk/reify ::delete-token-set @@ -175,7 +181,9 @@ changes (-> (pcb/empty-changes it) (pcb/with-library-data data) (pcb/delete-token-set token-set-id))] - (rx/of (dch/commit-changes changes)))))) + (rx/of + (dch/commit-changes changes) + (wtu/update-workspace-tokens)))))) (defn update-create-token [token] diff --git a/frontend/src/app/main/refs.cljs b/frontend/src/app/main/refs.cljs index 3772523cc..1daceafc9 100644 --- a/frontend/src/app/main/refs.cljs +++ b/frontend/src/app/main/refs.cljs @@ -259,6 +259,9 @@ st/state =)) +(def get-active-theme-sets-tokens + (l/derived wtts/get-active-theme-sets-tokens-names-map st/state =)) + (def workspace-tokens (l/derived (fn [data] diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs index e786b1141..7f6ba2145 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs @@ -101,7 +101,7 @@ selection-parents-ref (mf/use-memo (mf/deps ids) #(refs/parents-by-ids ids)) selection-parents (mf/deref selection-parents-ref) - tokens (-> (mf/deref refs/workspace-tokens) + tokens (-> (mf/deref refs/get-active-theme-sets-tokens) (sd/use-resolved-tokens)) tokens-by-type (mf/use-memo (mf/deps tokens) #(wtc/group-tokens-by-type tokens)) diff --git a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs index f61744058..7e3069493 100644 --- a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs @@ -21,15 +21,12 @@ [app.main.ui.workspace.tokens.core :as wtc] [app.main.ui.workspace.tokens.style-dictionary :as sd] [app.main.ui.workspace.tokens.token :as wtt] - [app.main.ui.workspace.tokens.token-set :as wtts] [app.main.ui.workspace.tokens.token-types :as wtty] - [app.main.ui.workspace.tokens.update :as wtu] [app.util.dom :as dom] [cuerdas.core :as str] [okulary.core :as l] [rumext.v2 :as mf] - [shadow.resource] - [clojure.set :as set])) + [shadow.resource])) (def lens:token-type-open-status (l/derived (l/in [:workspace-tokens :open-status]) st/state)) @@ -223,8 +220,7 @@ [:li {:class [(when (= selected-token-set-id id) "selected")] :on-click (fn [] (st/emit! - (wdt/set-selected-token-set-id id) - (wtu/update-workspace-tokens)))} + (wdt/set-selected-token-set-id id)))} [:div.spaced name [:div.spaced @@ -248,9 +244,9 @@ selected (mf/deref refs/selected-shapes) selected-shapes (into [] (keep (d/getf objects)) selected) - tokens (-> (mf/deref refs/workspace-tokens) - (sd/use-resolved-tokens)) + tokens (sd/use-resolved-workspace-tokens) token-groups (mf/with-memo [tokens] + (js/console.log "tokens" tokens) (sorted-token-groups tokens))] [:article [:& token-sets] diff --git a/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs b/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs index 81881d810..bed854695 100644 --- a/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs @@ -2,6 +2,7 @@ (:require ["@tokens-studio/sd-transforms" :as sd-transforms] ["style-dictionary$default" :as sd] + [app.common.data :refer [ordered-map]] [app.main.refs :as refs] [app.main.ui.workspace.tokens.token :as wtt] [cuerdas.core :as str] @@ -79,8 +80,10 @@ (resolve-sd-tokens+ config))] (let [resolved-tokens (reduce (fn [acc ^js cur] - (let [id (uuid (.-uuid (.-id cur))) - origin-token (get tokens id) + (let [identifier (if (uuid? (ffirst tokens)) + (uuid (.-uuid (.-id cur))) + (.. cur -original -name)) + origin-token (get tokens identifier) parsed-value (wtt/parse-token-value (.-value cur)) resolved-token (if (not parsed-value) (assoc origin-token :errors [:style-dictionary/missing-reference]) @@ -93,11 +96,6 @@ (js/console.log "Resolved tokens" resolved-tokens)) resolved-tokens))) -(defn resolve-workspace-tokens+ - [& {:keys [debug?] :as config}] - (when-let [workspace-tokens @refs/workspace-tokens] - (resolve-tokens+ workspace-tokens))) - ;; Hooks ----------------------------------------------------------------------- (defonce !tokens-cache (atom nil)) @@ -112,7 +110,7 @@ then the state will be updated with the resolved tokens." [tokens & {:keys [cache-atom] :or {cache-atom !tokens-cache}}] - (let [tokens-state (mf/use-state (get @cache-atom tokens tokens))] + (let [tokens-state (mf/use-state (get @cache-atom tokens))] (mf/use-effect (mf/deps tokens) (fn [] @@ -133,37 +131,3 @@ (defn use-resolved-workspace-tokens [& {:as config}] (-> (mf/deref refs/workspace-tokens) (use-resolved-tokens config))) - -;; Testing --------------------------------------------------------------------- - -(comment - (defonce !output (atom nil)) - - (-> @refs/workspace-tokens - (resolve-tokens+ {:debug? false}) - (.then js/console.log)) - - (-> (resolve-workspace-tokens+ {:debug? true}) - (p/then #(reset! !output %))) - - @!output - - (->> @refs/workspace-tokens - (resolve-tokens+) - (#(doto % js/console.log))) - - (-> - (clj->js {"a" {:name "a" :value "5"} - "b" {:name "b" :value "{a} * 2"}}) - - (#(resolve-sd-tokens+ % {:debug? true}))) - - (defonce output (atom nil)) - (require '[shadow.resource]) - (let [example (-> (shadow.resource/inline "./data/example-tokens-set.json") - (js/JSON.parse) - .-core)] - (.then (resolve-sd-tokens+ example {:debug? true}) - #(reset! output %))) - - nil) diff --git a/frontend/src/app/main/ui/workspace/tokens/token.cljs b/frontend/src/app/main/ui/workspace/tokens/token.cljs index 9c0efd356..aba9ae9a0 100644 --- a/frontend/src/app/main/ui/workspace/tokens/token.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/token.cljs @@ -4,6 +4,14 @@ [clojure.set :as set] [cuerdas.core :as str])) +(defn get-workspace-tokens + [state] + (get-in state [:workspace-data :tokens] {})) + +(defn get-workspace-token + [token-id state] + (get-in state [:workspace-data :tokens token-id])) + (def parseable-token-value-regexp "Regexp that can be used to parse a number value out of resolved token value. This regexp also trims whitespace around the value." diff --git a/frontend/src/app/main/ui/workspace/tokens/token_set.cljs b/frontend/src/app/main/ui/workspace/tokens/token_set.cljs index d9eec5ff8..bcfa5f574 100644 --- a/frontend/src/app/main/ui/workspace/tokens/token_set.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/token_set.cljs @@ -1,6 +1,8 @@ (ns app.main.ui.workspace.tokens.token-set (:require - [clojure.set :as set])) + [app.common.data :refer [ordered-map]] + [app.main.ui.workspace.tokens.token :as wtt] + [clojure.set :as set])) ;; Themes ---------------------------------------------------------------------- @@ -102,9 +104,6 @@ ;; Sets ------------------------------------------------------------------------ -(defn get-workspace-tokens [state] - (get-in state [:workspace-data :tokens])) - (defn get-workspace-sets [state] (get-in state [:workspace-data :token-sets-index])) @@ -112,6 +111,10 @@ (some-> (get-workspace-sets state) (get set-id))) +(defn get-workspace-token-set-tokens [set-id state] + (-> (get-token-set set-id state) + :tokens)) + (def default-token-set-name "Global") (defn create-global-set []) @@ -129,11 +132,22 @@ (defn get-selected-token-set-tokens [state] (when-let [token-set (get-selected-token-set state)] - (let [tokens (or (get-workspace-tokens state) {})] + (let [tokens (or (wtt/get-workspace-tokens state) {})] + (js/console.log "token-set" token-set (select-keys tokens (:tokens token-set))) (select-keys tokens (:tokens token-set))))) -(defn get-token-set-tokens [{:keys [tokens] :as token-set} file] - (map #(get-in file [:data :tokens %]) tokens)) - (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-active-set-ids state)] + (reduce + (fn [names-map-acc set-id] + (let [token-ids (get-workspace-token-set-tokens set-id state)] + (reduce + (fn [acc token-id] + (if-let [token (wtt/get-workspace-token token-id state)] + (assoc acc (wtt/token-identifier token) token) + acc)) + names-map-acc token-ids))) + (ordered-map) active-set-ids))) diff --git a/frontend/src/app/main/ui/workspace/tokens/update.cljs b/frontend/src/app/main/ui/workspace/tokens/update.cljs index 82decf153..1ae50d231 100644 --- a/frontend/src/app/main/ui/workspace/tokens/update.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/update.cljs @@ -121,7 +121,10 @@ ptk/WatchEvent (watch [_ state _] (->> - (rx/from (wtsd/resolve-tokens+ (wtts/get-selected-token-set-tokens state))) + (rx/from + (-> + (wtts/get-active-theme-sets-tokens-names-map state) + (wtsd/resolve-tokens+))) (rx/mapcat (fn [sd-tokens] (let [undo-id (js/Symbol)]