0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-15 09:11:21 -05:00

🐛 Fix flex elemen info doesn't show on inspect tab

This commit is contained in:
Pablo Alba 2022-12-12 16:56:25 +01:00
parent c148326d1c
commit 05e437ee06
5 changed files with 25 additions and 10 deletions

View file

@ -384,6 +384,17 @@
(def workspace-focus-selected (def workspace-focus-selected
(l/derived :workspace-focus-selected st/state)) (l/derived :workspace-focus-selected st/state))
(defn workspace-get-flex-child
[ids]
(l/derived
(fn [state]
(let [objects (wsh/lookup-page-objects state)]
(into []
(comp (map (d/getf objects))
(filter (partial ctl/layout-child? objects)))
ids)))
st/state =))
;; Remove this when deprecating components-v2 ;; Remove this when deprecating components-v2
(def remove-graphics (def remove-graphics
(l/derived :remove-graphics st/state)) (l/derived :remove-graphics st/state))

View file

@ -32,7 +32,7 @@
:text [:layout :text :shadow :blur :stroke :layout-flex-item]}) :text [:layout :text :shadow :blur :stroke :layout-flex-item]})
(mf/defc attributes (mf/defc attributes
[{:keys [page-id file-id shapes frame]}] [{:keys [page-id file-id shapes frame from]}]
(let [shapes (hooks/use-equal-memo shapes) (let [shapes (hooks/use-equal-memo shapes)
shapes (mf/with-memo [shapes] shapes (mf/with-memo [shapes]
(mapv #(gsh/translate-to-frame % frame) shapes)) (mapv #(gsh/translate-to-frame % frame) shapes))
@ -52,7 +52,8 @@
:text text-panel :text text-panel
:svg svg-panel) :svg svg-panel)
{:shapes shapes {:shapes shapes
:frame frame}]) :frame frame
:from from}])
[:& exports [:& exports
{:shapes shapes {:shapes shapes
:type type :type type

View file

@ -132,10 +132,10 @@
[:& copy-button {:data (copy-data shape :layout-item-min-h)}]])])])) [:& copy-button {:data (copy-data shape :layout-item-min-h)}]])])]))
(mf/defc layout-flex-element-panel (mf/defc layout-flex-element-panel
[{:keys [shapes]}] [{:keys [shapes from]}]
(let [route (mf/deref refs/route) (let [route (mf/deref refs/route)
page-id (:page-id (:query-params route)) page-id (:page-id (:query-params route))
mod-shapes (cd/get-flex-elements page-id shapes) mod-shapes (cd/get-flex-elements page-id shapes from)
shape (first mod-shapes) shape (first mod-shapes)
has-margin? (some? (:layout-item-margin shape)) has-margin? (some? (:layout-item-margin shape))
has-values? (or (some? (:layout-item-max-w shape)) has-values? (or (some? (:layout-item-max-w shape))

View file

@ -46,10 +46,12 @@
(cond-> code (cond-> code
(= type "svg") (beautify/html #js {"indent_size" 2})))) (= type "svg") (beautify/html #js {"indent_size" 2}))))
(defn get-flex-elements [page-id shapes] (defn get-flex-elements [page-id shapes from]
(let [ids (mapv :id shapes) (let [ids (mapv :id shapes)
ids (hooks/use-equal-memo ids) ids (hooks/use-equal-memo ids)
get-layout-children-refs (mf/use-memo (mf/deps ids page-id) #(refs/get-flex-child-viewer ids page-id))] get-layout-children-refs (mf/use-memo (mf/deps ids page-id from) #(if (= from :workspace)
(refs/workspace-get-flex-child ids)
(refs/get-flex-child-viewer ids page-id)))]
(mf/deref get-layout-children-refs))) (mf/deref get-layout-children-refs)))
@ -61,7 +63,7 @@
(map #(gsh/translate-to-frame % frame))) (map #(gsh/translate-to-frame % frame)))
route (mf/deref refs/route) route (mf/deref refs/route)
page-id (:page-id (:query-params route)) page-id (:page-id (:query-params route))
flex-items (get-flex-elements page-id shapes) flex-items (get-flex-elements page-id shapes from)
shapes (map #(assoc % :flex-items flex-items) shapes) shapes (map #(assoc % :flex-items flex-items) shapes)
style-code (-> (cg/generate-style-code @style-type shapes) style-code (-> (cg/generate-style-code @style-type shapes)
(format-code "css")) (format-code "css"))

View file

@ -65,7 +65,8 @@
[:& attributes {:page-id page-id [:& attributes {:page-id page-id
:file-id file-id :file-id file-id
:frame frame :frame frame
:shapes shapes}]] :shapes shapes
:from from}]]
[:& tab-element {:id :code :title (tr "handoff.tabs.code")} [:& tab-element {:id :code :title (tr "handoff.tabs.code")}
[:& code {:frame frame [:& code {:frame frame