Merge pull request #85 from tokens-studio/84-border-width

Stroke Width

common/src/app/common/types/token.cljc

@@ -35,6 +35,7 @@
 (def token-types
   #{:boolean
     :border-radius
+    :stroke-width
     :box-shadow
     :dimension
     :numeric
@@ -66,6 +67,12 @@
 
 (def border-radius-keys (schema-keys ::border-radius))
 
+(sm/def! ::stroke-width
+  [:map
+   [:stroke-width {:optional true} ::sm/uuid]])
+
+(def stroke-width-keys (schema-keys ::stroke-width))
+
 (sm/def! ::dimensions
   [:map
    [:width {:optional true} ::sm/uuid]

frontend/src/app/main/ui/workspace/tokens/core.cljs

@@ -71,6 +71,13 @@
   (st/emit!
    (dch/update-shapes shape-ids #(assoc % :opacity value))))
 
+(defn update-stroke-width
+  [value shape-ids]
+  (st/emit!
+   (dch/update-shapes shape-ids (fn [shape]
+                                  (when (seq (:strokes shape))
+                                    (assoc-in shape [:strokes 0 :stroke-width] value))))))
+
 (defn update-layout-spacing-column [value _shape-ids]
   (let [selected-shapes (wsh/lookup-selected @st/state)]
     (st/emit!
@@ -91,6 +98,13 @@
      :modal {:key :tokens/border-radius
              :fields [{:label "Border Radius"
                        :key :border-radius}]}}]
+   [:stroke-width
+    {:title "Stroke Width"
+     :attributes ctt/stroke-width-keys
+     :on-update-shape update-stroke-width
+     :modal {:key :tokens/stroke-width
+             :fields [{:label "Stroke Width"
+                       :key :stroke-width}]}}]
    [:box-shadow
     {:title "Box Shadow"
      :modal {:key :tokens/box-shadow

frontend/src/app/main/ui/workspace/tokens/modals.cljs

@@ -22,6 +22,12 @@
   [properties]
   [:& tokens-properties-form properties])
 
+(mf/defc stroke-width-modal
+  {::mf/register modal/components
+   ::mf/register-as :tokens/stroke-width}
+  [properties]
+  [:& tokens-properties-form properties])
+
 (mf/defc box-shadow-modal
   {::mf/register modal/components
    ::mf/register-as :tokens/box-shadow}