🐛 Fix export group with shadows on children

CHANGES.md

@@ -22,6 +22,7 @@
 - Allow three character hex and web colors in color picker hex input [#1184](https://github.com/penpot/penpot/issues/1184)
 - Allow lowercase search for fonts [#1180](https://github.com/penpot/penpot/issues/1180)
 - Fix group renaming problem [Taiga #1969](https://tree.taiga.io/project/penpot/issue/1969)
+- Fix export group with shadows on children [Taiga #2036](https://tree.taiga.io/project/penpot/issue/2036)
 
 ### :arrow_up: Deps updates
 ### :boom: Breaking changes

common/src/app/common/geom/shapes.cljc

@@ -141,6 +141,7 @@
 (d/export gpr/points->selrect)
 (d/export gpr/points->rect)
 (d/export gpr/center->rect)
+(d/export gpr/join-rects)
 
 (d/export gtr/move)
 (d/export gtr/absolute-move)

common/src/app/common/geom/shapes/rect.cljc

@@ -48,6 +48,16 @@
 (defn rect->selrect [rect]
   (-> rect rect->points points->selrect))
 
+(defn join-rects [rects]
+  (let [minx (transduce (comp (map :x) (remove nil?)) min ##Inf rects)
+        miny (transduce (comp (map :y) (remove nil?)) min ##Inf rects)
+        maxx (transduce (comp (map #(+ (:x %) (:width %))) (remove nil?)) max ##-Inf rects)
+        maxy (transduce (comp (map #(+ (:y %) (:height %))) (remove nil?)) max ##-Inf rects)]
+    {:x minx
+     :y miny
+     :width (- maxx minx)
+     :height (- maxy miny)}))
+
 (defn join-selrects [selrects]
   (let [minx (transduce (comp (map :x1) (remove nil?)) min ##Inf selrects)
         miny (transduce (comp (map :y1) (remove nil?)) min ##Inf selrects)

frontend/src/app/main/ui/render.cljs

@@ -25,6 +25,23 @@
    [cuerdas.core :as str]
    [rumext.alpha :as mf]))
 
+(defn bounds
+  [object objects]
+  (if (= :group (:type object))
+    (let [children-bounds
+          (into []
+                (comp  (map #(get objects %))
+                       (map #(bounds % objects)))
+                (:shapes object))]
+      (gsh/join-rects children-bounds))
+
+    (let [padding (filters/calculate-padding object)]
+      (-> (filters/get-filters-bounds object)
+          (update :x - padding)
+          (update :y - padding)
+          (update :width + (* 2 padding))
+          (update :height + (* 2 padding))))))
+
 (mf/defc object-svg
   {::mf/wrap [mf/memo]}
   [{:keys [objects object-id zoom render-texts?] :or {zoom 1} :as props}]
@@ -47,20 +64,10 @@
         objects  (reduce updt-fn objects mod-ids)
         object   (get objects object-id)
 
-        ;; We need to get the shadows/blurs paddings to create the viewbox properly
-        {:keys [x y width height]} (filters/get-filters-bounds object)
+        {:keys [x y width height] :as bs} (bounds object objects)
+        [_ _ width height :as coords] (->> [x y width height] (map #(* % zoom)))
 
-        x        (* x zoom)
-        y        (* y zoom)
-        width    (* width zoom)
-        height   (* height zoom)
-
-        padding (* (filters/calculate-padding object) zoom)
-
-        vbox     (str/join " " [(- x padding)
-                                (- y padding)
-                                (+ width padding padding)
-                                (+ height padding padding)])
+        vbox (str/join " " coords)
 
         frame-wrapper
         (mf/use-memo
@@ -84,14 +91,14 @@
 
     (mf/use-effect
      (mf/deps width height)
-     #(dom/set-page-style {:size (str (mth/ceil (+ width padding padding)) "px "
-                                      (mth/ceil (+ height padding padding)) "px")}))
+     #(dom/set-page-style {:size (str (mth/ceil width) "px "
+                                      (mth/ceil height) "px")}))
 
     [:& (mf/provider embed/context) {:value true}
      [:svg {:id "screenshot"
             :view-box vbox
-            :width (+ width padding padding)
-            :height (+ height padding padding)
+            :width width
+            :height height
             :version "1.1"
             :xmlns "http://www.w3.org/2000/svg"
             :xmlnsXlink "http://www.w3.org/1999/xlink"