Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-15 01:01:30 -05:00
Code Issues Activity

⚡ Add minor optimizations to shapes/group component

Browse source
This commit is contained in:
Andrey Antukh 2023-09-05 23:21:34 +02:00
parent c8b42478b0
commit 4dc41724de
1 changed files with 28 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
frontend/src/app/main/ui/shapes/group.cljs
View file

@ -9,7 +9,6 @@
[app.common.data.macros :as dm] [app.common.data.macros :as dm]
[app.main.ui.context :as muc] [app.main.ui.context :as muc]
[app.main.ui.shapes.mask :refer [mask-url clip-url mask-factory]] [app.main.ui.shapes.mask :refer [mask-url clip-url mask-factory]]
[app.util.object :as obj]
[rumext.v2 :as mf])) [rumext.v2 :as mf]))
(defn group-shape (defn group-shape
@ -20,39 +19,38 @@
[props] [props]
(let [shape (unchecked-get props "shape") (let [shape (unchecked-get props "shape")
childs (unchecked-get props "childs") childs (unchecked-get props "childs")
objects (unchecked-get props "objects")
render-id (mf/use-ctx muc/render-id) render-id (mf/use-ctx muc/render-id)
masked-group? (:masked-group shape) masked-group? (:masked-group shape)
[mask childs] (if masked-group? mask (if ^boolean masked-group?
[(first childs) (rest childs)] (first childs)
[nil childs]) nil)
childs (if ^boolean masked-group?
(rest childs)
childs)
;; We need to separate mask and clip into two because a bug in Firefox wrapper (if ^boolean masked-group? "g" mf/Fragment)
;; breaks when the group has clip+mask+foreignObject clip-props (if ^boolean masked-group?
;; Clip and mask separated will work in every platform #js {:clipPath (clip-url render-id mask)}
; Firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1734805 #js {})
[clip-wrapper clip-props]
(if masked-group?
["g" (-> (obj/create)
(obj/set! "clipPath" (clip-url render-id mask)))]
[mf/Fragment nil])
[mask-wrapper mask-props] mask-props (if ^boolean masked-group?
(if masked-group? #js {:mask (mask-url render-id mask)}
["g" (-> (obj/create) #js {})]
(obj/set! "mask" (mask-url render-id mask)))]
[mf/Fragment nil])]
[:> clip-wrapper clip-props ;; We need to separate mask and clip into two because a bug in
[:> mask-wrapper mask-props ;; Firefox breaks when the group has clip+mask+foreignObject
(when masked-group? ;; Clip and mask separated will work in every platform Firefox
[:> render-mask #js {:mask mask ;; bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1734805
:objects objects}]) [:> wrapper clip-props
[:> wrapper mask-props
(when ^boolean masked-group?
[:& render-mask {:mask mask}])
(for [item childs] (for [item childs]
[:& shape-wrapper {:shape item [:& shape-wrapper
:key (dm/str (:id item))}])]])))) {:shape item
:key (dm/str (dm/get-prop item :id))}])]]))))