🎉 Create typography style from a selected text layer

CHANGES.md

@@ -6,6 +6,7 @@
 
 ### :sparkles: New features
 - Default naming of text layers [Taiga #2836](https://tree.taiga.io/project/penpot/us/2836)
+- Create typography style from a selected text layer [Taiga #3041](https://tree.taiga.io/project/penpot/us/3041)
 
 ### :bug: Bugs fixed
 

frontend/src/app/main/ui/workspace/sidebar/assets.cljs

@@ -14,6 +14,7 @@
    [app.common.text :as txt]
    [app.common.types.components-list :as ctkl]
    [app.common.types.file :as ctf]
+   [app.common.uuid :as uuid]
    [app.config :as cf]
    [app.main.data.events :as ev]
    [app.main.data.modal :as modal]
@@ -35,6 +36,7 @@
    [app.main.ui.context :as ctx]
    [app.main.ui.hooks :as h]
    [app.main.ui.icons :as i]
+   [app.main.ui.workspace.sidebar.options.menus.text :refer [generate-typography-name]]
    [app.main.ui.workspace.sidebar.options.menus.typography :refer [typography-entry]]
    [app.util.color :as uc]
    [app.util.dom :as dom]
@@ -1735,11 +1737,44 @@
                                   (seq (:colors selected-assets)))
         workspace-read-only?  (mf/use-ctx ctx/workspace-read-only?)
 
+        text-shapes (->>
+                     (mf/deref refs/selected-objects)
+                     (filter #(= (:type %) :text)))
+
+        state-map (mf/deref refs/workspace-editor-state)
+        text-shape (first text-shapes)
+        editor-state (get state-map (:id text-shape))
+
+        text-values (dwt/current-text-values
+                      {:editor-state editor-state
+                       :shape text-shape
+                       :attrs dwt/text-attrs})
+
+        multiple? (or (> 1 (count text-shape))
+                    (->> text-values vals (d/seek #(= % :multiple))))
+
+        values (-> (d/without-nils text-values)
+                   (select-keys
+                     (d/concat-vec dwt/text-font-attrs
+                       dwt/text-spacing-attrs
+                       dwt/text-transform-attrs)))
+
+        typography-id (uuid/next)
+        typography (-> (if multiple?
+                         txt/default-typography
+                         (merge txt/default-typography values))
+                       (generate-typography-name)
+                       (assoc :id typography-id))
+
         add-typography
         (mf/use-fn
-         (mf/deps file-id)
+         (mf/deps file-id typography)
          (fn [_]
-           (st/emit! (dwl/add-typography txt/default-typography)
+           (when (not multiple?)
+             (st/emit! (dwt/update-attrs (:id text-shape) {:typography-ref-id typography-id
+                                                           :typography-ref-file file-id})))
+
+           (st/emit! (dwl/add-typography typography)
              (ptk/event ::ev/event {::ev/name "add-asset-to-library"
                                     :asset-type "typography"}))))