diff --git a/frontend/src/app/main/data/workspace/tokens/application.cljs b/frontend/src/app/main/data/workspace/tokens/application.cljs index 6f52e92df9..3ee7758284 100644 --- a/frontend/src/app/main/data/workspace/tokens/application.cljs +++ b/frontend/src/app/main/data/workspace/tokens/application.cljs @@ -51,7 +51,7 @@ (defn update-shape-radius ([value shape-ids attributes] (update-shape-radius value shape-ids attributes nil)) - ([value shape-ids attributes page-id] ; The attributes param is needed to have the same arity that other update functions + ([value shape-ids attributes page-id] (when (number? value) (let [value (max 0 value)] (dwsh/update-shapes shape-ids diff --git a/frontend/src/app/plugins/shape.cljs b/frontend/src/app/plugins/shape.cljs index 9075448ca8..3692267fd4 100644 --- a/frontend/src/app/plugins/shape.cljs +++ b/frontend/src/app/plugins/shape.cljs @@ -54,7 +54,7 @@ [app.plugins.register :as r] [app.plugins.ruler-guides :as rg] [app.plugins.text :as text] - [app.plugins.tokens :refer [resolve-tokens translate-prop token-attr?]] + [app.plugins.tokens :refer [applied-tokens-plugin->applied-tokens token-attr-plugin->token-attr token-attr?]] [app.plugins.utils :as u] [app.util.http :as http] [app.util.object :as obj] @@ -1298,15 +1298,15 @@ {:this true :get (fn [_] - (let [tokens + (let [applied-tokens (-> (u/locate-shape file-id page-id id) (get :applied-tokens) - (resolve-tokens))] + (applied-tokens-plugin->applied-tokens))] (reduce (fn [acc [prop name]] (obj/set! acc (json/write-camel-key prop) name)) #js {} - tokens)))} + applied-tokens)))} :applyToken {:enumerable false @@ -1315,7 +1315,7 @@ [:maybe [:set [:and ::sm/keyword [:fn token-attr?]]]]] :fn (fn [token attrs] (let [token (u/locate-token file-id (obj/get token "$set-id") (obj/get token "$id")) - kw-attrs (into #{} (map (comp translate-prop keyword) attrs))] + kw-attrs (into #{} (map token-attr-plugin->token-attr attrs))] (if (some #(not (token-attr? %)) kw-attrs) (u/display-not-valid :applyToken attrs) (st/emit! diff --git a/frontend/src/app/plugins/tokens.cljs b/frontend/src/app/plugins/tokens.cljs index 281b82fbc9..6c3a4f5eff 100644 --- a/frontend/src/app/plugins/tokens.cljs +++ b/frontend/src/app/plugins/tokens.cljs @@ -20,42 +20,47 @@ [app.plugins.utils :as u] [app.util.object :as obj] [clojure.datafy :refer [datafy]] - [clojure.set :refer [map-invert]] - [cuerdas.core :as str])) + [clojure.set :refer [map-invert]])) ;; === Token -(def token-name-mapping - {:r1 :borderRadiusTopLeft - :r2 :borderRadiusTopRight - :r3 :borderRadiusBottomRight - :r4 :borderRadiusBottomLeft +;; Give more semantic names to the shape attributes that tokens can be applied to +(def ^:private map:token-attr->token-attr-plugin + {:r1 :border-radius-top-left + :r2 :border-radius-top-right + :r3 :border-radius-bottom-right + :r4 :border-radius-bottom-left - :p1 :paddingTopLeft - :p2 :paddingTopRight - :p3 :paddingBottomRight - :p4 :paddingBottomLeft + :p1 :padding-top-left + :p2 :padding-top-right + :p3 :padding-bottom-right + :p4 :padding-bottom-left - :m1 :marginTopLeft - :m2 :marginTopRight - :m3 :marginBottomRight - :m4 :marginBottomLeft}) + :m1 :margin-top-left + :m2 :margin-top-right + :m3 :margin-bottom-right + :m4 :margin-bottom-left}) -(def name-token-mapping - (map-invert token-name-mapping)) +(def ^:private map:token-attr-plugin->token-attr + (map-invert map:token-attr->token-attr-plugin)) -(defn resolve-prop +(defn token-attr->token-attr-plugin [k] - (get token-name-mapping k k)) + (get map:token-attr->token-attr-plugin k k)) -(defn translate-prop +(defn token-attr-plugin->token-attr [k] - (let [k (-> (str/camel k) keyword)] - (get name-token-mapping k k))) + (get map:token-attr-plugin->token-attr k k)) + +(defn applied-tokens-plugin->applied-tokens + [value] + (into {} + (map (fn [[k v]] [(token-attr->token-attr-plugin k) v])) + value)) (defn token-attr? [attr] - (cto/token-attr? (translate-prop attr))) + (cto/token-attr? (token-attr-plugin->token-attr attr))) (defn- apply-token-to-shapes [file-id set-id id shape-ids attrs] @@ -65,7 +70,7 @@ (u/display-not-valid :applyToSelected attrs) (st/emit! (dwta/toggle-token {:token token - :attrs (into #{} (map translate-prop) attrs) + :attrs (into #{} (map token-attr-plugin->token-attr) attrs) :shape-ids shape-ids :expand-with-children false}))))) @@ -77,13 +82,6 @@ (ts/tokenscript-symbols->penpot-unit))] resolved-value)) - -(defn resolve-tokens - [value] - (into {} - (map (fn [[k v]] [(resolve-prop k) v])) - value)) - (defn token-proxy? [p] (obj/type-of? p "TokenProxy")) diff --git a/plugins/apps/poc-tokens-plugin/src/app/app.component.ts b/plugins/apps/poc-tokens-plugin/src/app/app.component.ts index 0b5584fbe8..8b60e40d8d 100644 --- a/plugins/apps/poc-tokens-plugin/src/app/app.component.ts +++ b/plugins/apps/poc-tokens-plugin/src/app/app.component.ts @@ -264,7 +264,7 @@ export class AppComponent { type: 'apply-token', setId: this.currentSetId, tokenId, - // properties: ['strokeColor'] // Uncomment to choose attribute to apply + // properties: ['borderRadiusTopRight'] // Uncomment to choose attribute to apply }); // (incompatible attributes will have no effect) } }