🐛 Fix stroke width token application (#7039)

CHANGES.md

@@ -53,6 +53,7 @@
 - Fix X & Y position do not sincronize with tokens [Taiga #11617](https://tree.taiga.io/project/penpot/issue/11617)
 - Fix tooltip position after first time [Taiga #11688](https://tree.taiga.io/project/penpot/issue/11688)
 - Fix export button width on inspect tab [Taiga #11394](https://tree.taiga.io/project/penpot/issue/11394)
+- Fix stroke width token application [Taiga #11724](https://tree.taiga.io/project/penpot/issue/11724)
 
 ## 2.8.1 (Unreleased)
 

common/src/app/common/types/stroke.cljc

@@ -0,0 +1,20 @@
+;; This Source Code Form is subject to the terms of the Mozilla Public
+;; License, v. 2.0. If a copy of the MPL was not distributed with this
+;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
+;;
+;; Copyright (c) KALEIDOS INC
+
+(ns app.common.types.stroke
+  (:require
+   [app.common.colors :as clr]))
+
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+;; SCHEMAS
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+
+(def default-stroke
+  {:stroke-alignment :inner
+   :stroke-style :solid
+   :stroke-color clr/black
+   :stroke-opacity 1
+   :stroke-width 1})

frontend/src/app/main/data/workspace/tokens/application.cljs

@@ -11,6 +11,7 @@
    [app.common.text :as txt]
    [app.common.types.shape.layout :as ctsl]
    [app.common.types.shape.radius :as ctsr]
+   [app.common.types.stroke :as cts]
    [app.common.types.token :as ctt]
    [app.common.types.tokens-lib :as ctob]
    [app.common.types.typography :as cty]
@@ -91,8 +92,10 @@
    (when (number? value)
      (dwsh/update-shapes shape-ids
                          (fn [shape]
-                           (when (seq (:strokes shape))
+                           (if (seq (:strokes shape))
-                             (assoc-in shape [:strokes 0 :stroke-width] value)))
+                             (assoc-in shape [:strokes 0 :stroke-width] value)
+                             (let [stroke (assoc cts/default-stroke :stroke-width value)]
+                               (assoc shape :strokes [stroke]))))
                          {:reg-objects? true
                           :ignore-touched true
                           :page-id page-id

frontend/src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs

@@ -7,9 +7,9 @@
 (ns app.main.ui.workspace.sidebar.options.menus.stroke
   (:require-macros [app.main.style :as stl])
   (:require
-   [app.common.colors :as clr]
    [app.common.data :as d]
    [app.common.data.macros :as dm]
+   [app.common.types.stroke :as cts]
    [app.main.data.workspace :as udw]
    [app.main.data.workspace.colors :as dc]
    [app.main.store :as st]
@@ -157,11 +157,7 @@
         on-add-stroke
         (fn [_]
           (st/emit! (udw/trigger-bounding-box-cloaking ids))
-          (st/emit! (dc/add-stroke ids {:stroke-alignment :inner
+          (st/emit! (dc/add-stroke ids cts/default-stroke))
-                                        :stroke-style :solid
-                                        :stroke-color clr/black
-                                        :stroke-opacity 1
-                                        :stroke-width 1}))
           (when (not (some? (seq strokes))) (open-content)))
 
         disable-drag    (mf/use-state false)

frontend/test/frontend_tests/tokens/logic/token_actions_test.cljs

@@ -450,9 +450,9 @@
              (t/testing "token got applied to rect with stroke and shape stroke got updated"
                (t/is (= (:stroke-width (:applied-tokens rect-with-stroke')) (:name token-target')))
                (t/is (= (get-in rect-with-stroke' [:strokes 0 :stroke-width]) 10)))
-             (t/testing "token got applied to rect without stroke but shape didnt get updated"
+             (t/testing "token got applied to rect without stroke and shape stroke got updated"
                (t/is (= (:stroke-width (:applied-tokens rect-without-stroke')) (:name token-target')))
-               (t/is (empty? (:strokes rect-without-stroke')))))))))))
+               (t/is (= (get-in rect-without-stroke' [:strokes 0 :stroke-width]) 10))))))))))
 
 (t/deftest test-apply-font-size
   (t/testing "applies font-size token and updates the text font-size"