Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-21 06:02:32 -05:00
Code Issues Activity

Adding themes

Browse source
This commit is contained in:
Florian Schroedl 2024-09-19 15:44:56 +02:00
parent 7758e48c48
commit 743f61f2cd
8 changed files with 40 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
common/src/app/common/data/macros.cljc
View file

@ -16,6 +16,10 @@
[cljs.analyzer.api :as aapi]
[cuerdas.core :as str]))
(defmacro legacy
"Purely annotational macro to find instances later to remove when the refactor to tokens-lib is done."
[& body] `(do ~@body))
(defmacro select-keys
"A macro version of `select-keys`. Useful when keys vector is known
at compile time (aprox 600% performance boost).

6
common/src/app/common/files/changes.cljc
View file

@ -274,7 +274,7 @@
[:mod-token-theme
[:map {:title "ModTokenThemeChange"}
[:type [:= :mod-token-theme]]
[:id ::sm/uuid]
(dm/legacy [:id {:optional true} [:maybe ::sm/uuid]])
[:name :string]
[:token-theme ::ctot/token-theme]]]
@ -860,7 +860,6 @@
(defmethod process-change :add-token-theme
[data {:keys [token-theme]}]
(-> data
(ctotl/add-token-theme token-theme)
(update :tokens-lib
#(-> %
(ctob/ensure-tokens-lib)
@ -871,7 +870,8 @@
(defmethod process-change :mod-token-theme
[data {:keys [id name group token-theme]}]
(-> data
(ctotl/update-token-theme id merge token-theme)
(dm/legacy (#(when id
(ctotl/update-token-theme % (random-uuid) merge token-theme))))
(update :tokens-lib
#(-> %
(ctob/ensure-tokens-lib)

6
common/src/app/common/files/changes_builder.cljc
View file

@ -713,14 +713,14 @@
[changes token-theme]
(-> changes
(update :redo-changes conj {:type :add-token-theme :token-theme token-theme})
(update :undo-changes conj {:type :del-token-theme :id (:id token-theme) :name (:name token-theme)})
;; (legacy (update :undo-changes conj {:type :del-token-theme :name (:name token-theme)}))
(apply-changes-local)))
(defn update-token-theme
[changes token-theme prev-token-theme]
(-> changes
(update :redo-changes conj {:type :mod-token-theme :id (:id token-theme) :name (:name prev-token-theme) :token-theme token-theme})
(update :undo-changes conj {:type :mod-token-theme :id (:id token-theme) :name (:name token-theme) :token-theme (or prev-token-theme token-theme)})
(update :redo-changes conj {:type :mod-token-theme :name (:name prev-token-theme) :token-theme token-theme})
(update :undo-changes conj {:type :mod-token-theme :name (:name token-theme) :token-theme (or prev-token-theme token-theme)})
(apply-changes-local)))
(defn delete-token-theme

0
common/src/app/common/macros.cljc Normal file
View file

3
common/src/app/common/types/token_theme.cljc
View file

@ -6,11 +6,12 @@
(ns app.common.types.token-theme
(:require
[app.common.data.macros :as dm]
[app.common.schema :as sm]))
(sm/register! ::token-theme
[:map {:title "TokenTheme"}
[:id ::sm/uuid]
(dm/legacy [:id {:optional true} [:maybe ::sm/uuid]])
[:name :string]
[:group {:optional true} :string]
[:source? {:optional true} :boolean]

22
frontend/src/app/main/data/tokens.cljs
View file

@ -11,6 +11,7 @@
[app.common.files.changes-builder :as pcb]
[app.common.geom.point :as gpt]
[app.common.types.shape :as cts]
[app.common.types.tokens-lib :as ctob]
[app.common.uuid :as uuid]
[app.main.data.changes :as dch]
[app.main.data.workspace.shapes :as dwsh]
@ -40,6 +41,13 @@
(watch [_ _ _]
(rx/of (dwsh/update-shapes [id] #(merge % attrs))))))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; TOKENS Getters
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defn get-tokens-lib [state]
(get-in state [:workspace-data :tokens-lib]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; TOKENS Actions
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
@ -98,11 +106,7 @@
(map #(get-in file [:tokens %]) (:tokens token-set)))
(defn create-token-theme [token-theme]
(let [new-token-theme (merge
{:id (uuid/next)
:sets #{}
:selected :enabled}
token-theme)]
(let [new-token-theme token-theme]
(ptk/reify ::create-token-theme
ptk/WatchEvent
(watch [it _ _]
@ -111,13 +115,13 @@
(rx/of
(dch/commit-changes changes)))))))
(defn update-token-theme [token-theme]
(defn update-token-theme [[group name] token-theme]
(ptk/reify ::update-token-theme
ptk/WatchEvent
(watch [it state _]
(let [prev-token-theme (wtts/get-workspace-token-theme (:id token-theme) state)
changes (-> (pcb/empty-changes it)
(pcb/update-token-theme token-theme prev-token-theme))]
(let [tokens-lib (get-tokens-lib state)
prev-token-theme (some-> tokens-lib (ctob/get-theme group name))
changes (pcb/update-token-theme (pcb/empty-changes it) token-theme prev-token-theme)]
(rx/of
(dch/commit-changes changes))))))

5
frontend/src/app/main/ui/workspace/tokens/macros.clj
View file

@ -1,5 +0,0 @@
(ns app.main.ui.workspace.tokens.macros)
(defmacro legacy
"Purely annotational macro to find instances later to remove when the refactor to tokens-lib is done."
[& body] `(do ~@body))

29
frontend/src/app/main/ui/workspace/tokens/modals/themes.cljs
View file

@ -15,12 +15,11 @@
[app.main.ui.icons :as i]
[app.main.ui.workspace.tokens.common :refer [labeled-input] :as wtco]
[app.main.ui.workspace.tokens.sets :as wts]
[app.main.ui.workspace.tokens.sets-context :as sets-context]
[app.main.ui.workspace.tokens.token-set :as wtts]
[app.util.dom :as dom]
[rumext.v2 :as mf]
[cuerdas.core :as str]
[app.main.ui.workspace.tokens.sets-context :as sets-context]
[app.main.ui.shapes.group :as group]))
[rumext.v2 :as mf]))
(def ^:private chevron-icon
(i/icon-xref :arrow (stl/css :chevron-icon)))
@ -110,10 +109,8 @@
"Create theme"]]]))
(mf/defc edit-theme
[{:keys [token-sets theme theme-groups on-back on-submit]}]
[{:keys [edit? token-sets theme theme-groups on-back on-submit]}]
(let [{:keys [dropdown-open? on-open-dropdown on-close-dropdown on-toggle-dropdown]} (wtco/use-dropdown-open-state)
edit? (some? (:id theme))
theme-state (mf/use-state {:token-sets token-sets
:theme theme})
disabled? (-> (get-in @theme-state [:theme :name])
@ -139,13 +136,15 @@
(fn [e]
(dom/prevent-default e)
(let [theme (:theme @theme-state)
final-name (str/trim (:name theme))
final-group (-> (:group theme)
(str/trim)
(str/lower))]
final-name (-> (:name theme)
(str/trim))
empty-description? (-> (:description theme)
(str/trim)
(str/empty?))]
(when-not (str/empty? final-name)
(cond-> theme
(empty final-group) (dissoc :group)
empty-description? (assoc :description "")
:always (doto js/console.log)
:always on-submit)))
(on-back)))]
[:form {:on-submit on-save-form}
@ -219,11 +218,12 @@
theme (mf/deref (refs/workspace-token-theme theme-group theme-name))
theme-groups (mf/deref refs/workspace-token-theme-groups)]
[:& edit-theme
{:token-sets token-sets
{:edit? true
:token-sets token-sets
:theme theme
:theme-groups theme-groups
:on-back #(set-state (constantly {:type :themes-overview}))
:on-submit #(st/emit! (wdt/update-token-theme %))}]))
:on-submit #(st/emit! (wdt/update-token-theme [(:group theme) (:name theme)] %))}]))
(mf/defc create-theme
[{:keys [set-state]}]
@ -231,7 +231,8 @@
theme {:name "" :sets #{}}
theme-groups (mf/deref refs/workspace-token-theme-groups)]
[:& edit-theme
{:token-sets token-sets
{:edit? false
:token-sets token-sets
:theme theme
:theme-groups theme-groups
:on-back #(set-state (constantly {:type :themes-overview}))