3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-06-13 06:41:39 +02:00
Code Issues Projects Releases Packages Wiki Activity

✨ Adds child layout options to grid children

Browse source
This commit is contained in:
alonso.torres 2023-05-04 17:07:08 +02:00
parent cdebf245e3
commit 4bd15b5de1
11 changed files with 48 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

8
frontend/src/app/main/refs.cljs
View file

@ -485,22 +485,22 @@
(defn workspace-text-modifier-by-id [id] (defn workspace-text-modifier-by-id [id]
(l/derived #(get % id) workspace-text-modifier =)) (l/derived #(get % id) workspace-text-modifier =))
(defn is-flex-layout-child? (defn is-layout-child?
[ids] [ids]
(l/derived (l/derived
(fn [objects] (fn [objects]
(->> ids (->> ids
(map (d/getf objects)) (map (d/getf objects))
(some (partial ctl/flex-layout-immediate-child? objects)))) (some (partial ctl/any-layout-immediate-child? objects))))
workspace-page-objects)) workspace-page-objects))
(defn all-flex-layout-child? (defn all-layout-child?
[ids] [ids]
(l/derived (l/derived
(fn [objects] (fn [objects]
(->> ids (->> ids
(map (d/getf objects)) (map (d/getf objects))
(every? (partial ctl/flex-layout-immediate-child? objects)))) (every? (partial ctl/any-layout-immediate-child? objects))))
workspace-page-objects)) workspace-page-objects))
(defn get-flex-child-viewer (defn get-flex-child-viewer

8
frontend/src/app/main/ui/workspace/sidebar/options/shapes/bool.cljs
View file

@ -30,8 +30,8 @@
layout-item-values (select-keys shape layout-item-attrs) layout-item-values (select-keys shape layout-item-attrs)
layout-container-values (select-keys shape layout-container-flex-attrs) layout-container-values (select-keys shape layout-container-flex-attrs)
is-flex-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-flex-layout-child? ids)) is-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-layout-child? ids))
is-flex-layout-child? (mf/deref is-flex-layout-child-ref) is-layout-child? (mf/deref is-layout-child-ref)
is-layout-child-absolute? (ctl/layout-absolute? shape)] is-layout-child-absolute? (ctl/layout-absolute? shape)]
[:* [:*
@ -41,7 +41,7 @@
:shape shape}] :shape shape}]
[:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}] [:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}]
(when is-flex-layout-child? (when is-layout-child?
[:& layout-item-menu [:& layout-item-menu
{:ids ids {:ids ids
:type type :type type
@ -49,7 +49,7 @@
:is-layout-child? true :is-layout-child? true
:shape shape}]) :shape shape}])
(when (or (not is-flex-layout-child?) is-layout-child-absolute?) (when (or (not is-layout-child?) is-layout-child-absolute?)
[:& constraints-menu {:ids ids [:& constraints-menu {:ids ids
:values constraint-values}]) :values constraint-values}])
[:& layer-menu {:ids ids [:& layer-menu {:ids ids

8
frontend/src/app/main/ui/workspace/sidebar/options/shapes/circle.cljs
View file

@ -32,8 +32,8 @@
layout-item-values (select-keys shape layout-item-attrs) layout-item-values (select-keys shape layout-item-attrs)
layout-container-values (select-keys shape layout-container-flex-attrs) layout-container-values (select-keys shape layout-container-flex-attrs)
is-flex-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-flex-layout-child? ids)) is-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-layout-child? ids))
is-flex-layout-child? (mf/deref is-flex-layout-child-ref) is-layout-child? (mf/deref is-layout-child-ref)
is-layout-child-absolute? (ctl/layout-absolute? shape)] is-layout-child-absolute? (ctl/layout-absolute? shape)]
[:* [:*
[:& measures-menu {:ids ids [:& measures-menu {:ids ids
@ -42,14 +42,14 @@
:shape shape}] :shape shape}]
[:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}] [:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}]
(when is-flex-layout-child? (when is-layout-child?
[:& layout-item-menu {:ids ids [:& layout-item-menu {:ids ids
:type type :type type
:values layout-item-values :values layout-item-values
:is-layout-child? true :is-layout-child? true
:is-layout-container? false :is-layout-container? false
:shape shape}]) :shape shape}])
(when (or (not is-flex-layout-child?) is-layout-child-absolute?) (when (or (not is-layout-child?) is-layout-child-absolute?)
[:& constraints-menu {:ids ids [:& constraints-menu {:ids ids
:values constraint-values}]) :values constraint-values}])
[:& layer-menu {:ids ids [:& layer-menu {:ids ids

10
frontend/src/app/main/ui/workspace/sidebar/options/shapes/frame.cljs
View file

@ -36,8 +36,8 @@
layout-item-values (select-keys shape layout-item-attrs) layout-item-values (select-keys shape layout-item-attrs)
[comp-ids comp-values] [[(:id shape)] (select-keys shape component-attrs)] [comp-ids comp-values] [[(:id shape)] (select-keys shape component-attrs)]
is-flex-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-flex-layout-child? ids)) is-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-layout-child? ids))
is-flex-layout-child? (mf/deref is-flex-layout-child-ref) is-layout-child? (mf/deref is-layout-child-ref)
is-flex-layout-container? (ctl/flex-layout? shape) is-flex-layout-container? (ctl/flex-layout? shape)
is-layout-child-absolute? (ctl/layout-absolute? shape)] is-layout-child-absolute? (ctl/layout-absolute? shape)]
[:* [:*
@ -48,17 +48,17 @@
[:& component-menu {:ids comp-ids [:& component-menu {:ids comp-ids
:values comp-values :values comp-values
:shape shape}] :shape shape}]
(when (or (not is-flex-layout-child?) is-layout-child-absolute?) (when (or (not is-layout-child?) is-layout-child-absolute?)
[:& constraints-menu {:ids ids [:& constraints-menu {:ids ids
:values constraint-values}]) :values constraint-values}])
[:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}] [:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}]
(when (or is-flex-layout-child? is-flex-layout-container?) (when (or is-layout-child? is-flex-layout-container?)
[:& layout-item-menu [:& layout-item-menu
{:ids ids {:ids ids
:type type :type type
:values layout-item-values :values layout-item-values
:is-layout-child? is-flex-layout-child? :is-layout-child? is-layout-child?
:is-layout-container? is-flex-layout-container? :is-layout-container? is-flex-layout-container?
:shape shape}]) :shape shape}])

8
frontend/src/app/main/ui/workspace/sidebar/options/shapes/group.cljs
View file

@ -36,8 +36,8 @@
file-id (unchecked-get props "file-id") file-id (unchecked-get props "file-id")
layout-container-values (select-keys shape layout-container-flex-attrs) layout-container-values (select-keys shape layout-container-flex-attrs)
ids [(:id shape)] ids [(:id shape)]
is-flex-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-flex-layout-child? ids)) is-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-layout-child? ids))
is-flex-layout-child? (mf/deref is-flex-layout-child-ref) is-layout-child? (mf/deref is-layout-child-ref)
is-layout-child-absolute? (ctl/layout-absolute? shape) is-layout-child-absolute? (ctl/layout-absolute? shape)
type :group type :group
@ -58,7 +58,7 @@
[:& component-menu {:ids comp-ids :values comp-values :shape shape}] ;;remove this in components-v2 [:& component-menu {:ids comp-ids :values comp-values :shape shape}] ;;remove this in components-v2
[:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}] [:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}]
(when is-flex-layout-child? (when is-layout-child?
[:& layout-item-menu [:& layout-item-menu
{:type type {:type type
:ids layout-item-ids :ids layout-item-ids
@ -66,7 +66,7 @@
:is-layout-container? false :is-layout-container? false
:values layout-item-values}]) :values layout-item-values}])
(when (or (not is-flex-layout-child?) is-layout-child-absolute?) (when (or (not is-layout-child?) is-layout-child-absolute?)
[:& constraints-menu {:ids constraint-ids :values constraint-values}]) [:& constraints-menu {:ids constraint-ids :values constraint-values}])
[:& layer-menu {:type type :ids layer-ids :values layer-values}] [:& layer-menu {:type type :ids layer-ids :values layer-values}]

8
frontend/src/app/main/ui/workspace/sidebar/options/shapes/image.cljs
View file

@ -32,8 +32,8 @@
layout-item-values (select-keys shape layout-item-attrs) layout-item-values (select-keys shape layout-item-attrs)
layout-container-values (select-keys shape layout-container-flex-attrs) layout-container-values (select-keys shape layout-container-flex-attrs)
is-flex-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-flex-layout-child? ids)) is-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-layout-child? ids))
is-flex-layout-child? (mf/deref is-flex-layout-child-ref) is-layout-child? (mf/deref is-layout-child-ref)
is-layout-child-absolute? (ctl/layout-absolute? shape)] is-layout-child-absolute? (ctl/layout-absolute? shape)]
[:* [:*
[:& measures-menu {:ids ids [:& measures-menu {:ids ids
@ -42,7 +42,7 @@
:shape shape}] :shape shape}]
[:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}] [:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}]
(when is-flex-layout-child? (when is-layout-child?
[:& layout-item-menu [:& layout-item-menu
{:ids ids {:ids ids
:type type :type type
@ -50,7 +50,7 @@
:is-layout-child? true :is-layout-child? true
:shape shape}]) :shape shape}])
(when (or (not is-flex-layout-child?) is-layout-child-absolute?) (when (or (not is-layout-child?) is-layout-child-absolute?)
[:& constraints-menu {:ids ids [:& constraints-menu {:ids ids
:values constraint-values}]) :values constraint-values}])

14
frontend/src/app/main/ui/workspace/sidebar/options/shapes/multiple.cljs
View file

@ -294,15 +294,15 @@
all-types (into #{} (map :type shapes)) all-types (into #{} (map :type shapes))
ids (->> shapes (map :id)) ids (->> shapes (map :id))
is-flex-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-flex-layout-child? ids)) is-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-layout-child? ids))
is-flex-layout-child? (mf/deref is-flex-layout-child-ref) is-layout-child? (mf/deref is-layout-child-ref)
has-text? (contains? all-types :text) has-text? (contains? all-types :text)
has-flex-layout-container? (->> shapes (some ctl/flex-layout?)) has-flex-layout-container? (->> shapes (some ctl/flex-layout?))
all-flex-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/all-flex-layout-child? ids)) all-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/all-layout-child? ids))
all-flex-layout-child? (mf/deref all-flex-layout-child-ref) all-layout-child? (mf/deref all-layout-child-ref)
all-flex-layout-container? (->> shapes (every? ctl/flex-layout?)) all-flex-layout-container? (->> shapes (every? ctl/flex-layout?))
@ -342,15 +342,15 @@
[:& layout-container-menu {:type type :ids layout-container-ids :values layout-container-values :multiple true}] [:& layout-container-menu {:type type :ids layout-container-ids :values layout-container-values :multiple true}]
(when (or is-flex-layout-child? has-flex-layout-container?) (when (or is-layout-child? has-flex-layout-container?)
[:& layout-item-menu [:& layout-item-menu
{:type type {:type type
:ids layout-item-ids :ids layout-item-ids
:is-layout-child? all-flex-layout-child? :is-layout-child? all-layout-child?
:is-layout-container? all-flex-layout-container? :is-layout-container? all-flex-layout-container?
:values layout-item-values}]) :values layout-item-values}])
(when-not (or (empty? constraint-ids) is-flex-layout-child?) (when-not (or (empty? constraint-ids) is-layout-child?)
[:& constraints-menu {:ids constraint-ids :values constraint-values}]) [:& constraints-menu {:ids constraint-ids :values constraint-values}])
(when-not (empty? layer-ids) (when-not (empty? layer-ids)

8
frontend/src/app/main/ui/workspace/sidebar/options/shapes/path.cljs
View file

@ -32,8 +32,8 @@
layout-item-values (select-keys shape layout-item-attrs) layout-item-values (select-keys shape layout-item-attrs)
layout-container-values (select-keys shape layout-container-flex-attrs) layout-container-values (select-keys shape layout-container-flex-attrs)
is-flex-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-flex-layout-child? ids)) is-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-layout-child? ids))
is-flex-layout-child? (mf/deref is-flex-layout-child-ref) is-layout-child? (mf/deref is-layout-child-ref)
is-layout-child-absolute? (ctl/layout-absolute? shape)] is-layout-child-absolute? (ctl/layout-absolute? shape)]
[:* [:*
[:& measures-menu {:ids ids [:& measures-menu {:ids ids
@ -42,14 +42,14 @@
:shape shape}] :shape shape}]
[:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}] [:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}]
(when is-flex-layout-child? (when is-layout-child?
[:& layout-item-menu {:ids ids [:& layout-item-menu {:ids ids
:type type :type type
:values layout-item-values :values layout-item-values
:is-layout-child? true :is-layout-child? true
:is-layout-container? false :is-layout-container? false
:shape shape}]) :shape shape}])
(when (or (not is-flex-layout-child?) is-layout-child-absolute?) (when (or (not is-layout-child?) is-layout-child-absolute?)
[:& constraints-menu {:ids ids [:& constraints-menu {:ids ids
:values constraint-values}]) :values constraint-values}])
[:& layer-menu {:ids ids [:& layer-menu {:ids ids

8
frontend/src/app/main/ui/workspace/sidebar/options/shapes/rect.cljs
View file

@ -32,8 +32,8 @@
stroke-values (select-keys shape stroke-attrs) stroke-values (select-keys shape stroke-attrs)
layout-item-values (select-keys shape layout-item-attrs) layout-item-values (select-keys shape layout-item-attrs)
layout-container-values (select-keys shape layout-container-flex-attrs) layout-container-values (select-keys shape layout-container-flex-attrs)
is-flex-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-flex-layout-child? ids)) is-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-layout-child? ids))
is-flex-layout-child? (mf/deref is-flex-layout-child-ref) is-layout-child? (mf/deref is-layout-child-ref)
is-layout-child-absolute? (ctl/layout-absolute? shape)] is-layout-child-absolute? (ctl/layout-absolute? shape)]
[:* [:*
[:& measures-menu {:ids ids [:& measures-menu {:ids ids
@ -41,7 +41,7 @@
:values measure-values :values measure-values
:shape shape}] :shape shape}]
[:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}] [:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}]
(when is-flex-layout-child? (when is-layout-child?
[:& layout-item-menu [:& layout-item-menu
{:ids ids {:ids ids
:type type :type type
@ -49,7 +49,7 @@
:is-layout-child? true :is-layout-child? true
:shape shape}]) :shape shape}])
(when (or (not is-flex-layout-child?) is-layout-child-absolute?) (when (or (not is-layout-child?) is-layout-child-absolute?)
[:& constraints-menu {:ids ids [:& constraints-menu {:ids ids
:values constraint-values}]) :values constraint-values}])

8
frontend/src/app/main/ui/workspace/sidebar/options/shapes/svg_raw.cljs
View file

@ -106,8 +106,8 @@
layout-item-values (select-keys shape layout-item-attrs) layout-item-values (select-keys shape layout-item-attrs)
layout-container-values (select-keys shape layout-container-flex-attrs) layout-container-values (select-keys shape layout-container-flex-attrs)
is-flex-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-flex-layout-child? ids)) is-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-layout-child? ids))
is-flex-layout-child? (mf/deref is-flex-layout-child-ref) is-layout-child? (mf/deref is-layout-child-ref)
is-layout-child-absolute? (ctl/layout-absolute? shape)] is-layout-child-absolute? (ctl/layout-absolute? shape)]
(when (contains? svg-elements tag) (when (contains? svg-elements tag)
@ -118,7 +118,7 @@
:shape shape}] :shape shape}]
[:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}] [:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}]
(when is-flex-layout-child? (when is-layout-child?
[:& layout-item-menu [:& layout-item-menu
{:ids ids {:ids ids
:type type :type type
@ -126,7 +126,7 @@
:is-layout-child? true :is-layout-child? true
:shape shape}]) :shape shape}])
(when (or (not is-flex-layout-child?) is-layout-child-absolute?) (when (or (not is-layout-child?) is-layout-child-absolute?)
[:& constraints-menu {:ids ids [:& constraints-menu {:ids ids
:values constraint-values}]) :values constraint-values}])

8
frontend/src/app/main/ui/workspace/sidebar/options/shapes/text.cljs
View file

@ -28,8 +28,8 @@
(let [ids [(:id shape)] (let [ids [(:id shape)]
type (:type shape) type (:type shape)
is-flex-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-flex-layout-child? ids)) is-layout-child-ref (mf/use-memo (mf/deps ids) #(refs/is-layout-child? ids))
is-flex-layout-child? (mf/deref is-flex-layout-child-ref) is-layout-child? (mf/deref is-layout-child-ref)
layout-container-values (select-keys shape layout-container-flex-attrs) layout-container-values (select-keys shape layout-container-flex-attrs)
is-layout-child-absolute? (ctl/layout-absolute? shape) is-layout-child-absolute? (ctl/layout-absolute? shape)
state-map (mf/deref refs/workspace-editor-state) state-map (mf/deref refs/workspace-editor-state)
@ -76,7 +76,7 @@
:shape shape}] :shape shape}]
[:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}] [:& layout-container-menu {:type type :ids [(:id shape)] :values layout-container-values :multiple false}]
(when is-flex-layout-child? (when is-layout-child?
[:& layout-item-menu [:& layout-item-menu
{:ids ids {:ids ids
:type type :type type
@ -84,7 +84,7 @@
:is-layout-child? true :is-layout-child? true
:shape shape}]) :shape shape}])
(when (or (not is-flex-layout-child?) is-layout-child-absolute?) (when (or (not is-layout-child?) is-layout-child-absolute?)
[:& constraints-menu [:& constraints-menu
{:ids ids {:ids ids
:values (select-keys shape constraint-attrs)}]) :values (select-keys shape constraint-attrs)}])