mirror of
https://github.com/penpot/penpot.git
synced 2025-03-28 15:41:25 -05:00
🐛 Fix problems with grid layout and flex children absolute
This commit is contained in:
parent
c8d19c846a
commit
4e1353caf1
7 changed files with 42 additions and 38 deletions
|
@ -224,8 +224,18 @@
|
|||
(remove ctl/position-absolute?)
|
||||
(remove gco/invalid-geometry?))
|
||||
|
||||
auto? (or (ctl/auto? parent)
|
||||
(and (ctl/grid-layout? objects (:parent-id parent))
|
||||
(ctl/fill? parent)))
|
||||
auto-width? (or (ctl/auto-width? parent)
|
||||
(and (ctl/grid-layout? objects (:parent-id parent))
|
||||
(ctl/fill-width? parent)))
|
||||
auto-height? (or (ctl/auto-height? parent)
|
||||
(and (ctl/grid-layout? objects (:parent-id parent))
|
||||
(ctl/fill-height? parent)))
|
||||
|
||||
content-bounds
|
||||
(when (and (d/not-empty? children) (ctl/auto? parent))
|
||||
(when (and (d/not-empty? children) auto?)
|
||||
(cond
|
||||
(ctl/flex-layout? parent)
|
||||
(gcfl/layout-content-bounds bounds parent children objects)
|
||||
|
@ -238,12 +248,11 @@
|
|||
|
||||
auto-width (when content-bounds (gpo/width-points content-bounds))
|
||||
auto-height (when content-bounds (gpo/height-points content-bounds))]
|
||||
|
||||
(cond-> (ctm/empty)
|
||||
(and (some? auto-width) (ctl/auto-width? parent))
|
||||
(and (some? auto-width) auto-width?)
|
||||
(set-parent-auto-width auto-width)
|
||||
|
||||
(and (some? auto-height) (ctl/auto-height? parent))
|
||||
(and (some? auto-height) auto-height?)
|
||||
(set-parent-auto-height auto-height))))
|
||||
|
||||
(defn find-auto-layouts
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
|
||||
(def conjv (fnil conj []))
|
||||
|
||||
;; Setted in app.common.geom.shapes.common-layout
|
||||
;; Setted in app.common.geom.shapes.min-size-layout
|
||||
;; We do it this way because circular dependencies
|
||||
(def -child-min-width nil)
|
||||
|
||||
|
|
|
@ -24,14 +24,16 @@
|
|||
(ctl/child-min-width child)
|
||||
|
||||
(and strict? (ctl/fill-width? child) (ctl/flex-layout? child))
|
||||
(let [children (cfh/get-immediate-children objects (dm/get-prop child :id) {:remove-hidden true})]
|
||||
(let [children (->> (cfh/get-immediate-children objects (dm/get-prop child :id))
|
||||
(remove ctl/position-absolute?))]
|
||||
(max (ctl/child-min-width child)
|
||||
(gpo/width-points (fb/layout-content-bounds bounds child children objects))))
|
||||
|
||||
(and (ctl/fill-width? child)
|
||||
(ctl/grid-layout? child))
|
||||
(let [children
|
||||
(->> (cfh/get-immediate-children objects (:id child) {:remove-hidden true})
|
||||
(->> (cfh/get-immediate-children objects (:id child))
|
||||
(remove ctl/position-absolute?)
|
||||
(map #(vector @(get bounds (:id %)) %)))
|
||||
layout-data (gd/calc-layout-data child @(get bounds (:id child)) children bounds objects true)]
|
||||
(max (ctl/child-min-width child)
|
||||
|
@ -52,13 +54,15 @@
|
|||
(ctl/child-min-height child)
|
||||
|
||||
(and strict? (ctl/fill-height? child) (ctl/flex-layout? child))
|
||||
(let [children (cfh/get-immediate-children objects (dm/get-prop child :id) {:remove-hidden true})]
|
||||
(let [children (->> (cfh/get-immediate-children objects (dm/get-prop child :id))
|
||||
(remove ctl/position-absolute?))]
|
||||
(max (ctl/child-min-height child)
|
||||
(gpo/height-points (fb/layout-content-bounds bounds child children objects))))
|
||||
|
||||
(and (ctl/fill-height? child) (ctl/grid-layout? child))
|
||||
(let [children
|
||||
(->> (cfh/get-immediate-children objects (dm/get-prop child :id) {:remove-hidden true})
|
||||
(->> (cfh/get-immediate-children objects (dm/get-prop child :id))
|
||||
(remove ctl/position-absolute?)
|
||||
(map (fn [child] [@(get bounds (:id child)) child])))
|
||||
layout-data (gd/calc-layout-data child (:points child) children bounds objects true)
|
||||
auto-bounds (gb/layout-content-bounds bounds child layout-data)]
|
||||
|
|
|
@ -517,7 +517,6 @@
|
|||
ids (seq ids)]
|
||||
(if (empty? ids)
|
||||
objects
|
||||
|
||||
(let [id (first ids)
|
||||
modifier (dm/get-in modifiers [id :modifiers])]
|
||||
(recur (d/update-when objects id transform-shape modifier)
|
||||
|
|
|
@ -1599,13 +1599,13 @@
|
|||
(into #{}
|
||||
(filter #(and
|
||||
(not (contains? deleted-cells %))
|
||||
(not= (dissoc (get source-cells %) :shapes :row :column :row-span :column-span)
|
||||
(dissoc (get target-cells %) :shapes :row :column :row-span :column-span))))
|
||||
(not= (get-data source-cells %)
|
||||
(get-data target-cells %))))
|
||||
(keys target-cells))]
|
||||
|
||||
(->> touched-cells
|
||||
(reduce
|
||||
(fn [cells id]
|
||||
(-> cells
|
||||
(d/update-when id d/patch-object (dissoc (get target-cells id) :shapes :row :column :row-span :column-span))))
|
||||
(d/update-when id d/patch-object (get-data target-cells id))))
|
||||
source-cells))))))
|
||||
|
|
|
@ -1395,7 +1395,7 @@
|
|||
|
||||
(defn- update-flex-child-copy-attrs
|
||||
"Synchronizes the attributes inside the flex-child items (main->copy)"
|
||||
[changes shape-main shape-copy main-container main-component copy-container omit-touched?]
|
||||
[changes _shape-main shape-copy main-container main-component copy-container omit-touched?]
|
||||
(-> changes
|
||||
(pcb/with-container copy-container)
|
||||
(pcb/with-objects (:objects copy-container))
|
||||
|
@ -1448,7 +1448,7 @@
|
|||
|
||||
(defn- update-grid-main-attrs
|
||||
"Synchronizes the `layout-grid-cells` property from the copy to the main shape"
|
||||
[changes shape-main shape-copy main-container copy-container omit-touched?]
|
||||
[changes shape-main shape-copy main-container copy-container _omit-touched?]
|
||||
(let [ids-map
|
||||
(into {}
|
||||
(comp
|
||||
|
|
|
@ -27,7 +27,6 @@
|
|||
[app.main.store :as st]
|
||||
[app.main.ui.css-cursors :as cur]
|
||||
[app.main.ui.formats :as fmt]
|
||||
[app.main.ui.hooks :as hooks]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.workspace.viewport.viewport-ref :as uwvv]
|
||||
[app.util.debug :as dbg]
|
||||
|
@ -937,34 +936,27 @@
|
|||
(map (fn [[_ idx]] idx))
|
||||
(into #{}))
|
||||
|
||||
children
|
||||
(mf/use-memo
|
||||
(mf/deps objects shape modifiers)
|
||||
(fn []
|
||||
(let [ids (cfh/get-children-ids objects (:id shape))
|
||||
objects (-> objects
|
||||
(gsh/apply-objects-modifiers (select-keys modifiers ids))
|
||||
(gsh/update-shapes-geometry (reverse ids)))]
|
||||
(->> (cfh/get-immediate-children objects (:id shape))
|
||||
(keep (fn [child]
|
||||
(when-not (:hidden child)
|
||||
[(gpo/parent-coords-bounds (:points child) (:points shape)) child])))))))
|
||||
|
||||
children (hooks/use-equal-memo children)
|
||||
|
||||
bounds (:points shape)
|
||||
hv #(gpo/start-hv bounds %)
|
||||
vv #(gpo/start-vv bounds %)
|
||||
origin (gpo/origin bounds)
|
||||
|
||||
all-bounds (d/lazy-map (keys objects) #(gsh/shape->points (get objects %)))
|
||||
|
||||
{:keys [row-tracks column-tracks
|
||||
column-total-size column-total-gap
|
||||
row-total-size row-total-gap] :as layout-data}
|
||||
layout-data
|
||||
(mf/use-memo
|
||||
(mf/deps shape children)
|
||||
#(gsg/calc-layout-data shape bounds children all-bounds objects))
|
||||
(mf/deps shape modifiers)
|
||||
(fn []
|
||||
(let [objects (gsh/apply-objects-modifiers objects modifiers)
|
||||
ids (cfh/get-children-ids objects (:id shape))
|
||||
objects (gsh/update-shapes-geometry objects (reverse ids))
|
||||
|
||||
children
|
||||
(->> (cfh/get-immediate-children objects (:id shape) {:remove-hidden true})
|
||||
(map #(vector (gpo/parent-coords-bounds (:points %) (:points shape)) %)))
|
||||
|
||||
children-bounds (d/lazy-map ids #(gsh/shape->points (get objects %)))]
|
||||
(gsg/calc-layout-data shape bounds children children-bounds objects))))
|
||||
|
||||
{:keys [row-tracks column-tracks column-total-size column-total-gap row-total-size row-total-gap]} layout-data
|
||||
|
||||
width (max (gpo/width-points bounds) (+ column-total-size column-total-gap (ctl/h-padding shape)))
|
||||
height (max (gpo/height-points bounds) (+ row-total-size row-total-gap (ctl/v-padding shape)))
|
||||
|
|
Loading…
Add table
Reference in a new issue