diff --git a/CHANGES.md b/CHANGES.md index af8a2b425..347147c73 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -5,6 +5,7 @@ ### :bug: Bugs fixed - Fix problems with imported SVG shadows [Taiga #4922](https://tree.taiga.io/project/penpot/issue/4922) +- Fix problems with imported SVG embedded images and transforms [Taiga #4639](https://tree.taiga.io/project/penpot/issue/4639) ## 1.18.0 diff --git a/frontend/src/app/main/data/workspace/svg_upload.cljs b/frontend/src/app/main/data/workspace/svg_upload.cljs index ae5354b15..0a9b3c5d0 100644 --- a/frontend/src/app/main/data/workspace/svg_upload.cljs +++ b/frontend/src/app/main/data/workspace/svg_upload.cljs @@ -181,7 +181,7 @@ (-> (update-in [:svg-attrs :style] dissoc :mix-blend-mode) (assoc :blend-mode (-> (get-in shape [:svg-attrs :style :mix-blend-mode]) keyword))))) -(defn create-raw-svg [name frame-id svg-data {:keys [attrs] :as data}] +(defn create-raw-svg [name frame-id svg-data {:keys [tag attrs] :as data}] (let [{:keys [x y width height offset-x offset-y]} svg-data] (-> {:id (uuid/next) :type :svg-raw @@ -191,6 +191,7 @@ :height height :x x :y y + :hidden (= tag :defs) :content (cond-> data (map? data) (update :attrs usvg/clean-attrs))} (assoc :svg-attrs attrs) @@ -388,7 +389,7 @@ disp-matrix (str (gmt/translate-matrix displacement)) element-data (-> element-data (assoc :tag :g) - (update :attrs dissoc :x :y :width :height :href :xlink:href) + (update :attrs dissoc :x :y :width :height :href :xlink:href :transform) (update :attrs usvg/add-transform disp-matrix) (assoc :content [use-data]))] (parse-svg-element frame-id svg-data element-data unames)) @@ -419,7 +420,7 @@ hidden (assoc :hidden true)) children (cond->> (:content element-data) - (or (= tag :g) (= tag :svg)) + (contains? usvg/parent-tags tag) (mapv #(usvg/inherit-attributes attrs %)))] [shape children])))))) @@ -469,12 +470,12 @@ (rx/map (fn [uri] (merge {:file-id file-id - :is-local true} + :is-local true + :url uri} (if (str/starts-with? uri "data:") {:name "image" :content (data-uri->blob uri)} - {:name (extract-name uri) - :url uri})))) + {:name (extract-name uri)})))) (rx/mapcat (fn [uri-data] (->> (rp/command! (if (contains? uri-data :content) :upload-file-media-object @@ -577,12 +578,9 @@ (pcb/add-object new-shape)) changes - (reduce (fn [changes [index new-child]] - (-> changes - (pcb/add-object new-child) - (pcb/change-parent (:parent-id new-child) [new-child] index))) - changes - (d/enumerate new-children)) + (reduce (fn [changes new-child] + (-> changes (pcb/add-object new-child))) + changes new-children) changes (pcb/resize-parents changes (->> changes diff --git a/frontend/src/app/main/ui/workspace/shapes.cljs b/frontend/src/app/main/ui/workspace/shapes.cljs index 1bc7e29d0..e7b5ae517 100644 --- a/frontend/src/app/main/ui/workspace/shapes.cljs +++ b/frontend/src/app/main/ui/workspace/shapes.cljs @@ -100,10 +100,8 @@ opts #js {:shape shape :thumbnail? thumbnail?} - svg-leaf? (and (= :svg-raw (:type shape)) (string? (:content shape))) - [wrapper wrapper-props] - (if svg-leaf? + (if (= :svg-raw (:type shape)) [mf/Fragment nil] ["g" #js {:className "workspace-shape-wrapper"}])] diff --git a/frontend/src/app/util/svg.cljs b/frontend/src/app/util/svg.cljs index 21f084d84..e724136a5 100644 --- a/frontend/src/app/util/svg.cljs +++ b/frontend/src/app/util/svg.cljs @@ -389,7 +389,8 @@ :mask-type}) (defonce inheritable-props - [:clip-rule + [:style + :clip-rule :color :color-interpolation :color-interpolation-filters @@ -458,6 +459,12 @@ :feTile :feTurbulence}) +(def parent-tags + #{:g + :svg + :text + :tspan}) + ;; By spec: https://www.w3.org/TR/SVG11/single-page.html#struct-GElement (defonce svg-group-safe-tags #{:animate