From cf9ef2ae6038734557fe1a3c4ff8d4eb703afae7 Mon Sep 17 00:00:00 2001 From: Florian Schroedl Date: Wed, 14 Aug 2024 15:33:24 +0200 Subject: [PATCH 1/3] Remove unused function --- frontend/src/app/main/ui/workspace/tokens/changes.cljs | 9 --------- 1 file changed, 9 deletions(-) diff --git a/frontend/src/app/main/ui/workspace/tokens/changes.cljs b/frontend/src/app/main/ui/workspace/tokens/changes.cljs index 45ff044df..fa3efb718 100644 --- a/frontend/src/app/main/ui/workspace/tokens/changes.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/changes.cljs @@ -148,15 +148,6 @@ (rx/of (dwsl/update-layout layout-shape-ids layout-attributes)))))) -(defn update-layout-spacing-column [value shape-ids] - (ptk/reify ::update-layout-spacing-column - ptk/WatchEvent - (watch [_ _ _] - (rx/concat - (for [shape-id shape-ids] - (let [layout-update {:layout-gap {:column-gap value :row-gap value}}] - (dwsl/update-layout [shape-id] layout-update))))))) - (defn update-shape-position [value shape-ids attributes] (ptk/reify ::update-shape-position ptk/WatchEvent From 1ba2acea7c2e296b95f2bbe7d867c5fc52a5b67d Mon Sep 17 00:00:00 2001 From: Florian Schroedl Date: Wed, 14 Aug 2024 16:39:43 +0200 Subject: [PATCH 2/3] Fix crash for applying spacing layout token --- .../options/menus/layout_container.cljs | 25 +++++++++++++------ .../app/main/ui/workspace/tokens/changes.cljs | 3 +++ .../ui/workspace/tokens/context_menu.cljs | 11 ++++---- 3 files changed, 25 insertions(+), 14 deletions(-) diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs index b2f71ae23..294185fe6 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs @@ -29,6 +29,8 @@ [app.main.ui.icons :as i] [app.main.ui.workspace.tokens.core :as wtc] [app.main.ui.workspace.tokens.editable-select :refer [editable-select]] + [app.main.ui.workspace.tokens.token :as wtt] + [app.main.ui.workspace.tokens.changes :as wtch] [app.main.ui.workspace.tokens.token-types :as wtty] [app.util.dom :as dom] [app.util.i18n :as i18n :refer [tr]] @@ -985,18 +987,25 @@ (mf/use-fn (mf/deps ids) (fn [type prop value] - (let [token-value (wtc/maybe-resolve-token-value value) - val (or token-value (mth/finite value 0))] + (let [token-identifier (wtt/token-identifier value) + val (or token-identifier (mth/finite value 0)) + on-update-shape wtch/update-layout-padding] (cond (and (= type :simple) (= prop :p1)) - (st/emit! (dwsl/update-layout ids {:layout-padding {:p1 val :p3 val} - :applied-tokens {:padding-p1 (if token-value (:id value) nil) - :padding-p3 (if token-value (:id value) nil)}})) + (if token-identifier + (st/emit! (wtch/apply-token {:shape-ids ids + :attributes #{:p1 :p3} + :token value + :on-update-shape on-update-shape})) + (st/emit! (on-update-shape value ids #{:p1 :p3}))) (and (= type :simple) (= prop :p2)) - (st/emit! (dwsl/update-layout ids {:layout-padding {:p2 val :p4 val} - :applied-tokens {:padding-p2 (if token-value (:id value) nil) - :padding-p4 (if token-value (:id value) nil)}})) + (if token-identifier + (st/emit! (wtch/apply-token {:shape-ids ids + :attributes #{:p2 :p4} + :token value + :on-update-shape on-update-shape})) + (st/emit! (on-update-shape value ids #{:p2 :p4}))) (some? prop) (st/emit! (dwsl/update-layout ids {:layout-padding {prop val}})))))) diff --git a/frontend/src/app/main/ui/workspace/tokens/changes.cljs b/frontend/src/app/main/ui/workspace/tokens/changes.cljs index fa3efb718..95243ee51 100644 --- a/frontend/src/app/main/ui/workspace/tokens/changes.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/changes.cljs @@ -136,6 +136,9 @@ (zipmap (repeat value)))] {:layout-gap layout-gap})) +(defn update-layout-padding [value shape-ids attrs] + (dwsl/update-layout shape-ids {:layout-padding (zipmap attrs (repeat value))})) + (defn update-layout-spacing [value shape-ids attributes] (ptk/reify ::update-layout-spacing ptk/WatchEvent diff --git a/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs b/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs index 615f758d4..57e6311d1 100644 --- a/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs @@ -81,8 +81,7 @@ (concat [all-action] single-actions))) (defn spacing-attribute-actions [{:keys [token selected-shapes] :as context-data}] - (let [on-update-shape (fn [resolved-value shape-ids attrs] - (dwsl/update-layout shape-ids {:layout-padding (zipmap attrs (repeat resolved-value))})) + (let [on-update-shape-padding wtch/update-layout-padding padding-attrs {:p1 "Top" :p2 "Right" :p3 "Bottom" @@ -105,7 +104,7 @@ :shape-ids shape-ids}] (if all-selected? (st/emit! (wtch/unapply-token props)) - (st/emit! (wtch/apply-token (assoc props :on-update-shape on-update-shape))))))} + (st/emit! (wtch/apply-token (assoc props :on-update-shape on-update-shape-padding))))))} {:title "Horizontal" :selected? horizontal-padding-selected? :action (fn [] @@ -116,7 +115,7 @@ horizontal-padding-selected? (wtch/apply-token (assoc props :attributes-to-remove horizontal-attributes)) :else (wtch/apply-token (assoc props :attributes horizontal-attributes - :on-update-shape on-update-shape)))] + :on-update-shape on-update-shape-padding)))] (st/emit! event)))} {:title "Vertical" :selected? vertical-padding-selected? @@ -128,7 +127,7 @@ vertical-padding-selected? (wtch/apply-token (assoc props :attributes-to-remove vertical-attributes)) :else (wtch/apply-token (assoc props :attributes vertical-attributes - :on-update-shape on-update-shape)))] + :on-update-shape on-update-shape-padding)))] (st/emit! event)))}] single-padding-items (->> padding-attrs (map (fn [[attr title]] @@ -149,7 +148,7 @@ all-selected? (-> (assoc props :attributes-to-remove all-padding-attrs) (wtch/apply-token)) selected? (wtch/unapply-token props) - :else (-> (assoc props :on-update-shape on-update-shape) + :else (-> (assoc props :on-update-shape on-update-shape-padding) (wtch/apply-token)))] (st/emit! event))})))) gap-items (all-or-sepearate-actions {:attribute-labels {:column-gap "Column Gap" From ecf4fb8bd055fc0be230f85f4ded8da1a53cda96 Mon Sep 17 00:00:00 2001 From: Florian Schroedl Date: Wed, 14 Aug 2024 16:52:46 +0200 Subject: [PATCH 3/3] Fix popover position --- frontend/src/app/main/ui/workspace/tokens/editable_select.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/frontend/src/app/main/ui/workspace/tokens/editable_select.scss b/frontend/src/app/main/ui/workspace/tokens/editable_select.scss index c0905cb8d..c404919ec 100644 --- a/frontend/src/app/main/ui/workspace/tokens/editable_select.scss +++ b/frontend/src/app/main/ui/workspace/tokens/editable_select.scss @@ -14,6 +14,7 @@ width: 100%; padding: $s-8; border-radius: $br-8; + position: relative; cursor: pointer; background: transparent;