0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-23 06:58:58 -05:00

Merge pull request #5355 from penpot/azazeln28-fix-component-list-jumps

🐛 Fix component list jumps
This commit is contained in:
Andrey Antukh 2024-11-25 11:44:05 +01:00 committed by GitHub
commit ef3588d05f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 20 additions and 17 deletions

View file

@ -338,7 +338,7 @@
;; used to render thumbnails on assets panel. ;; used to render thumbnails on assets panel.
(mf/defc component-svg (mf/defc component-svg
{::mf/wrap [mf/memo #(mf/deferred % ts/idle-then-raf)]} {::mf/wrap [mf/memo #(mf/deferred % ts/idle-then-raf)]}
[{:keys [objects root-shape show-grids? zoom class] :or {zoom 1} :as props}] [{:keys [objects root-shape show-grids? is-hidden zoom class] :or {zoom 1} :as props}]
(when root-shape (when root-shape
(let [root-shape-id (:id root-shape) (let [root-shape-id (:id root-shape)
include-metadata (mf/use-ctx export/include-metadata-ctx) include-metadata (mf/use-ctx export/include-metadata-ctx)
@ -381,13 +381,14 @@
:xmlns:penpot (when include-metadata "https://penpot.app/xmlns") :xmlns:penpot (when include-metadata "https://penpot.app/xmlns")
:fill "none"} :fill "none"}
[:* (when-not is-hidden
[:> shape-container {:shape root-shape'} [:*
[:& (mf/provider muc/is-component?) {:value true} [:> shape-container {:shape root-shape'}
[:& root-shape-wrapper {:shape root-shape' :view-box vbox}]]] [:& (mf/provider muc/is-component?) {:value true}
[:& root-shape-wrapper {:shape root-shape' :view-box vbox}]]]
(when show-grids? (when show-grids?
[:& empty-grids {:root-shape-id root-shape-id :objects objects}])]]))) [:& empty-grids {:root-shape-id root-shape-id :objects objects}])])])))
(mf/defc component-svg-thumbnail (mf/defc component-svg-thumbnail
{::mf/wrap [mf/memo #(mf/deferred % ts/idle-then-raf)]} {::mf/wrap [mf/memo #(mf/deferred % ts/idle-then-raf)]}

View file

@ -270,7 +270,7 @@
(mf/defc component-item-thumbnail (mf/defc component-item-thumbnail
"Component that renders the thumbnail image or the original SVG." "Component that renders the thumbnail image or the original SVG."
{::mf/props :obj} {::mf/props :obj}
[{:keys [file-id root-shape component container class]}] [{:keys [file-id root-shape component container class is-hidden]}]
(let [page-id (:main-instance-page component) (let [page-id (:main-instance-page component)
root-id (:main-instance-id component) root-id (:main-instance-id component)
retry (mf/use-state 0) retry (mf/use-state 0)
@ -290,7 +290,8 @@
(when (< @retry 3) (when (< @retry 3)
(inc retry))))] (inc retry))))]
(if (and (some? thumbnail-uri) (contains? cf/flags :component-thumbnails)) (if (and (some? thumbnail-uri)
(contains? cf/flags :component-thumbnails))
[:& component-svg-thumbnail [:& component-svg-thumbnail
{:thumbnail-uri thumbnail-uri {:thumbnail-uri thumbnail-uri
:class class :class class
@ -303,7 +304,8 @@
{:root-shape root-shape {:root-shape root-shape
:class class :class class
:objects (:objects container) :objects (:objects container)
:show-grids? true}]))) :show-grids? true
:is-hidden is-hidden}])))
(defn generate-components-menu-entries (defn generate-components-menu-entries
[shapes components-v2] [shapes components-v2]

View file

@ -171,13 +171,13 @@
(when ^boolean dragging? (when ^boolean dragging?
[:div {:class (stl/css :dragging)}])] [:div {:class (stl/css :dragging)}])]
(when visible? [:& cmm/component-item-thumbnail {:file-id file-id
[:& cmm/component-item-thumbnail {:file-id file-id :class (stl/css-case :thumbnail true
:class (stl/css-case :thumbnail true :asset-list-thumbnail (not listing-thumbs?))
:asset-list-thumbnail (not listing-thumbs?)) :root-shape root-shape
:root-shape root-shape :component component
:component component :container container
:container container}])])])) :is-hidden (not visible?)}]])]))
(mf/defc components-group (mf/defc components-group
{::mf/wrap-props false} {::mf/wrap-props false}