0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-24 07:29:08 -05:00

Adds layout items options

This commit is contained in:
alonso.torres 2022-09-06 13:19:19 +02:00
parent 3c424786a7
commit 5050c35257
3 changed files with 248 additions and 119 deletions

View file

@ -71,7 +71,26 @@
:constraints-h :constraints-group
:constraints-v :constraints-group
:fixed-scroll :constraints-group
:exports :exports-group})
:exports :exports-group
:layout :layout-container
:layout-dir :layout-container
:layout-gap :layout-container
:layout-type :layout-container
:layout-wrap-type :layout-container
:layout-padding-type :layout-container
:layout-padding :layout-container
:layout-h-orientation :layout-container
:layout-v-orientation :layout-container
:layout-margin :layout-item
:layout-margin-type :layout-item
:layout-h-behavior :layout-item
:layout-v-behavior :layout-item
:layout-max-h :layout-item
:layout-min-h :layout-item
:layout-max-w :layout-item
:layout-min-w :layout-item})
;; Attributes that may directly be edited by the user with forms
(def editable-attrs
@ -111,7 +130,26 @@
:stroke-cap-start
:stroke-cap-end
:exports}
:exports
:layout
:layout-dir
:layout-gap
:layout-type
:layout-wrap-type
:layout-padding-type
:layout-padding
:layout-h-orientation
:layout-v-orientation
:layout-margin
:layout-margin-type
:layout-h-behavior
:layout-v-behavior
:layout-max-h
:layout-min-h
:layout-max-w
:layout-min-w}
:group #{:proportion-lock
:width :height
@ -135,7 +173,16 @@
:blur
:exports}
:exports
:layout-margin
:layout-margin-type
:layout-h-behavior
:layout-v-behavior
:layout-max-h
:layout-min-h
:layout-max-w
:layout-min-w}
:rect #{:proportion-lock
:width :height
@ -180,7 +227,16 @@
:blur
:exports}
:exports
:layout-margin
:layout-margin-type
:layout-h-behavior
:layout-v-behavior
:layout-max-h
:layout-min-h
:layout-max-w
:layout-min-w}
:circle #{:proportion-lock
:width :height
@ -223,7 +279,16 @@
:blur
:exports}
:exports
:layout-margin
:layout-margin-type
:layout-h-behavior
:layout-v-behavior
:layout-max-h
:layout-min-h
:layout-max-w
:layout-min-w}
:path #{:proportion-lock
:width :height
@ -266,7 +331,16 @@
:blur
:exports}
:exports
:layout-margin
:layout-margin-type
:layout-h-behavior
:layout-v-behavior
:layout-max-h
:layout-min-h
:layout-max-w
:layout-min-w}
:text #{:proportion-lock
:width :height
@ -332,7 +406,16 @@
:grow-type
:exports}
:exports
:layout-margin
:layout-margin-type
:layout-h-behavior
:layout-v-behavior
:layout-max-h
:layout-min-h
:layout-max-w
:layout-min-w}
:image #{:proportion-lock
:width :height
@ -358,7 +441,16 @@
:blur
:exports}
:exports
:layout-margin
:layout-margin-type
:layout-h-behavior
:layout-v-behavior
:layout-max-h
:layout-min-h
:layout-max-w
:layout-min-w}
:svg-raw #{:proportion-lock
:width :height
@ -403,7 +495,16 @@
:blur
:exports}
:exports
:layout-margin
:layout-margin-type
:layout-h-behavior
:layout-v-behavior
:layout-max-h
:layout-min-h
:layout-max-w
:layout-min-w}
:bool #{:proportion-lock
:width :height
@ -446,5 +547,14 @@
:blur
:exports}})
:exports
:layout-margin
:layout-margin-type
:layout-h-behavior
:layout-v-behavior
:layout-max-h
:layout-min-h
:layout-max-w
:layout-min-w}})

View file

@ -136,7 +136,8 @@
(mf/defc layout-item-menu
{::mf/wrap [#(mf/memo' % (mf/check-props ["ids" "values" "type"]))]}
[{:keys [ids _type values is-layout-child? is-layout-container?] :as props}]
[{:keys [ids values is-layout-child? is-layout-container?] :as props}]
(let [open? (mf/use-state false)
toggle-open (fn [] (swap! open? not))

View file

@ -42,7 +42,9 @@
:blur :children
:stroke :shape
:text :children
:exports :shape}
:exports :shape
:layout-container :shape
:layout-item :shape}
:group
{:measure :shape
@ -53,7 +55,9 @@
:blur :shape
:stroke :children
:text :children
:exports :shape}
:exports :shape
:layout-container :ignore
:layout-item :shape}
:path
{:measure :shape
@ -64,7 +68,9 @@
:blur :shape
:stroke :shape
:text :ignore
:exports :shape}
:exports :shape
:layout-container :ignore
:layout-item :shape}
:text
{:measure :shape
@ -75,7 +81,9 @@
:blur :shape
:stroke :shape
:text :text
:exports :shape}
:exports :shape
:layout-container :ignore
:layout-item :shape}
:image
{:measure :shape
@ -86,7 +94,9 @@
:blur :shape
:stroke :ignore
:text :ignore
:exports :shape}
:exports :shape
:layout-container :ignore
:layout-item :shape}
:rect
{:measure :shape
@ -97,7 +107,9 @@
:blur :shape
:stroke :shape
:text :ignore
:exports :shape}
:exports :shape
:layout-container :ignore
:layout-item :shape}
:circle
{:measure :shape
@ -108,7 +120,9 @@
:blur :shape
:stroke :shape
:text :ignore
:exports :shape}
:exports :shape
:layout-container :ignore
:layout-item :shape}
:svg-raw
{:measure :shape
@ -119,7 +133,9 @@
:blur :shape
:stroke :shape
:text :ignore
:exports :shape}
:exports :shape
:layout-container :ignore
:layout-item :shape}
:bool
{:measure :shape
@ -130,7 +146,9 @@
:blur :shape
:stroke :shape
:text :ignore
:exports :shape}})
:exports :shape
:layout-container :ignore
:layout-item :shape}})
(def group->attrs
{:measure measure-attrs
@ -142,7 +160,7 @@
:stroke stroke-attrs
:text ot/attrs
:exports exports-attrs
:layout layout-container-flex-attrs
:layout-container layout-container-flex-attrs
:layout-item layout-item-attrs})
(def shadow-keys [:style :color :offset-x :offset-y :blur :spread])
@ -266,7 +284,7 @@
stroke-ids stroke-values
text-ids text-values
exports-ids exports-values
layout-ids layout-container-values
layout-container-ids layout-container-values
layout-item-ids layout-item-values]
(mf/use-memo
(mf/deps objects-no-measures)
@ -282,7 +300,7 @@
(get-attrs shapes objects-no-measures :stroke)
(get-attrs shapes objects-no-measures :text)
(get-attrs shapes objects-no-measures :exports)
(get-attrs shapes objects-no-measures :layout)
(get-attrs shapes objects-no-measures :layout-container)
(get-attrs shapes objects-no-measures :layout-item)
])))]
@ -291,7 +309,7 @@
[:& measures-menu {:type type :all-types all-types :ids measure-ids :values measure-values :shape shapes}])
(when (:layout layout-container-values)
[:& layout-container-menu {:type type :ids layout-ids :values layout-container-values}])
[:& layout-container-menu {:type type :ids layout-container-ids :values layout-container-values}])
(when is-layout-child?
[:& layout-item-menu