diff --git a/CHANGES.md b/CHANGES.md index 5238ce23a..8c3d7ac4f 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -4,8 +4,11 @@ ### :boom: Breaking changes & Deprecations ### :sparkles: New features + +- Adds layout flex functionality for boards - Better overlays interactions on boards inside boards [Taiga #4386](https://tree.taiga.io/project/penpot/us/4386) - Show board miniature in manual overlay setting [Taiga #4475](https://tree.taiga.io/project/penpot/issue/4475) + ### :bug: Bugs fixed - Add title to color bullets [Taiga #4218](https://tree.taiga.io/project/penpot/task/4218) diff --git a/frontend/resources/images/icons/auto-flex.svg b/frontend/resources/images/icons/auto-flex.svg deleted file mode 100644 index 9023c8fcf..000000000 --- a/frontend/resources/images/icons/auto-flex.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/frontend/resources/images/icons/auto-row-column.svg b/frontend/resources/images/icons/auto-row-column.svg deleted file mode 100644 index 9023c8fcf..000000000 --- a/frontend/resources/images/icons/auto-row-column.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/frontend/resources/images/icons/layout-columns.svg b/frontend/resources/images/icons/layout-columns.svg index 4c9381c99..eb4b7ba55 100644 --- a/frontend/resources/images/icons/layout-columns.svg +++ b/frontend/resources/images/icons/layout-columns.svg @@ -1,3 +1,3 @@ - - + + diff --git a/frontend/resources/images/icons/layout-rows.svg b/frontend/resources/images/icons/layout-rows.svg index f09a1ced8..9023c8fcf 100644 --- a/frontend/resources/images/icons/layout-rows.svg +++ b/frontend/resources/images/icons/layout-rows.svg @@ -1,3 +1,3 @@ - - + + diff --git a/frontend/src/app/main/data/workspace/shape_layout.cljs b/frontend/src/app/main/data/workspace/shape_layout.cljs index 1e6864349..c1a94684a 100644 --- a/frontend/src/app/main/data/workspace/shape_layout.cljs +++ b/frontend/src/app/main/data/workspace/shape_layout.cljs @@ -57,17 +57,23 @@ (dwm/apply-modifiers))) (rx/empty)))))) -;; TODO LAYOUT: Remove constraints from children +(defn get-layout-initializer + [type] + (let [initial-layout-data (if (= type :flex) initial-flex-layout initial-grid-layout)] + (fn [shape] + (-> shape + (merge shape initial-layout-data))))) + (defn create-layout [ids type] (ptk/reify ::create-layout ptk/WatchEvent - (watch [_ _ _] - (if (= type :flex) - (rx/of (dwc/update-shapes ids #(merge % initial-flex-layout)) - (update-layout-positions ids)) - (rx/of (dwc/update-shapes ids #(merge % initial-grid-layout)) - (update-layout-positions ids)))))) + (watch [_ state _] + (let [objects (wsh/lookup-page-objects state) + children-ids (into [] (mapcat #(get-in objects [% :shapes])) ids)] + (rx/of (dwc/update-shapes ids (get-layout-initializer type)) + (update-layout-positions ids) + (dwc/update-shapes children-ids #(dissoc % :constraints-h :constraints-v))))))) (defn remove-layout [ids] diff --git a/frontend/src/app/main/data/workspace/state_helpers.cljs b/frontend/src/app/main/data/workspace/state_helpers.cljs index c56931cf1..5804e1434 100644 --- a/frontend/src/app/main/data/workspace/state_helpers.cljs +++ b/frontend/src/app/main/data/workspace/state_helpers.cljs @@ -8,9 +8,9 @@ (:require [app.common.data :as d] [app.common.data.macros :as dm] + [app.common.geom.shapes :as gsh] [app.common.pages.helpers :as cph] - [app.common.path.commands :as upc] - [app.common.types.modifiers :as ctm])) + [app.common.path.commands :as upc])) (defn lookup-page ([state] @@ -127,16 +127,15 @@ (defn select-bool-children [parent-id state] (let [objects (lookup-page-objects state) - selected (lookup-selected-raw state) modifiers (:workspace-modifiers state) - children-ids (cph/get-children-ids objects parent-id) - selected-children (into [] (filter selected) children-ids) - - modifiers (select-keys modifiers selected-children) - children (select-keys objects children-ids)] + children + (-> (select-keys objects children-ids) + (d/update-vals + (fn [child] + (cond-> child + (contains? modifiers (:id child)) + (gsh/transform-shape (get-in modifiers [(:id child) :modifiers]))))))] (as-> children $ - ;; TODO LAYOUT: REVIEW THIS - (ctm/merge-modifiers $ modifiers) (d/mapm (set-content-modifiers state) $)))) diff --git a/frontend/src/app/main/data/workspace/texts.cljs b/frontend/src/app/main/data/workspace/texts.cljs index dbfb5f453..06592a153 100644 --- a/frontend/src/app/main/data/workspace/texts.cljs +++ b/frontend/src/app/main/data/workspace/texts.cljs @@ -319,17 +319,14 @@ (watch [_ _ _] (letfn [(update-fn [shape] (let [{:keys [selrect grow-type]} shape - {shape-width :width shape-height :height} selrect - modifier-width (ctm/change-dimensions shape :width new-width) - modifier-height (ctm/change-dimensions shape :height new-height)] - ;; TODO LAYOUT: MEZCLAR ESTOS EN UN UNICO MODIFIER + {shape-width :width shape-height :height} selrect] (cond-> shape (and (not-changed? shape-width new-width) (= grow-type :auto-width)) - (gsh/transform-shape modifier-width) + (gsh/transform-shape (ctm/change-dimensions shape :width new-width)) (and (not-changed? shape-height new-height) (or (= grow-type :auto-height) (= grow-type :auto-width))) - (gsh/transform-shape modifier-height))))] + (gsh/transform-shape (ctm/change-dimensions shape :height new-height)))))] (rx/of (dch/update-shapes [id] update-fn {:reg-objects? true :save-undo? false})))))) @@ -346,17 +343,13 @@ (defn apply-text-modifier [shape {:keys [width height position-data]}] - (let [modifier-width (when width (ctm/change-dimensions shape :width width)) - modifier-height (when height (ctm/change-dimensions shape :height height)) - - ;; TODO LAYOUT: MEZCLAR LOS DOS EN UN UNICO MODIFIER - new-shape + (let [new-shape (cond-> shape - (some? modifier-width) - (gsh/transform-shape modifier-width) + (some? width) + (gsh/transform-shape (ctm/change-dimensions shape :width width)) - (some? modifier-height) - (gsh/transform-shape modifier-height) + (some? height) + (gsh/transform-shape (ctm/change-dimensions shape :height height)) (some? position-data) (assoc :position-data position-data)) diff --git a/frontend/src/app/main/ui/shapes/bool.cljs b/frontend/src/app/main/ui/shapes/bool.cljs index 2c00a9684..d725a00ae 100644 --- a/frontend/src/app/main/ui/shapes/bool.cljs +++ b/frontend/src/app/main/ui/shapes/bool.cljs @@ -14,7 +14,6 @@ [app.util.object :as obj] [rumext.v2 :as mf])) -;; TODO LAYOUT: REVIEW DYNAMIC CHANGES IN BOOLEANS (defn bool-shape [shape-wrapper] (mf/fnc bool-shape @@ -34,9 +33,7 @@ (:bool-content shape) (some? childs) - (->> childs - #_(d/mapm #(gsh/transform-shape %2)) - (gsh/calc-bool-content shape)))))] + (gsh/calc-bool-content shape childs))))] [:* (when (some? bool-content) diff --git a/frontend/src/app/main/ui/workspace/shapes/path/editor.cljs b/frontend/src/app/main/ui/workspace/shapes/path/editor.cljs index 67b79a46a..8a991bf3f 100644 --- a/frontend/src/app/main/ui/workspace/shapes/path/editor.cljs +++ b/frontend/src/app/main/ui/workspace/shapes/path/editor.cljs @@ -185,8 +185,9 @@ matches (concat (second (:x snap-matches)) (second (:y snap-matches)))] [:g.snap-paths - (for [[from to] matches] - [:line {:x1 (:x from) + (for [[idx [from to]] (d/enumerate matches)] + [:line {:key (dm/str "snap-" idx "-" from "-" to) + :x1 (:x from) :y1 (:y from) :x2 (:x to) :y2 (:y to)