Merge pull request #3037 from penpot/alotor-bugfixes-3

Bug fixes

CHANGES.md

@@ -25,6 +25,10 @@
 - Fix problem on selection numeric inputs on Firefox [#2991](https://github.com/penpot/penpot/issues/2991)
 - Changed the text dominant-baseline to use ideographic [Taiga #4791](https://tree.taiga.io/project/penpot/issue/4791)
 - Viewer wrong translations [Github #3035](https://github.com/penpot/penpot/issues/3035)
+- Fix problem with text editor in Safari
+- Fix unlink library color when blur color picker input [#3026](https://github.com/penpot/penpot/issues/3026)
+- Fix snap pixel when moving path points on high zoom [#2930](https://github.com/penpot/penpot/issues/2930)
+- Fix shortcuts for zoom now take into account the mouse position [#2924](https://github.com/penpot/penpot/issues/2924)
 
 ### :arrow_up: Deps updates
 

frontend/src/app/main/data/workspace/path/edition.cljs

@@ -153,6 +153,8 @@
 
             selected-points (dm/get-in state [:workspace-local :edit-path id :selected-points] #{})
 
+            start-position (apply min #(gpt/distance start-position %) selected-points)
+
             content (st/get-path state :content)
             points (upg/content->points content)]
 
@@ -241,7 +243,7 @@
       (let [id (dm/get-in state [:workspace-local :edition])
             cx (d/prefix-keyword prefix :x)
             cy (d/prefix-keyword prefix :y)
-            start-point @ms/mouse-position
+
             modifiers (dm/get-in state [:workspace-local :edit-path id :content-modifiers])
             start-delta-x (dm/get-in modifiers [index cx] 0)
             start-delta-y (dm/get-in modifiers [index cy] 0)
@@ -258,7 +260,7 @@
         (streams/drag-stream
          (rx/concat
           (rx/of (dch/update-shapes [id] upsp/convert-to-path))
-          (->> (streams/move-handler-stream start-point point handler opposite points)
+          (->> (streams/move-handler-stream handler point handler opposite points)
                (rx/take-until (->> stream (rx/filter #(or (ms/mouse-up? %)
                                                           (streams/finish-edition? %)))))
                (rx/map
@@ -269,8 +271,8 @@
                      id
                      index
                      prefix
-                     (+ start-delta-x (- (:x pos) (:x start-point)))
+                     (+ start-delta-x (- (:x pos) (:x handler)))
-                     (+ start-delta-y (- (:y pos) (:y start-point)))
+                     (+ start-delta-y (- (:y pos) (:y handler)))
                      (not alt?))))))
           (rx/concat (rx/of (apply-content-modifiers)))))))))
 

frontend/src/app/main/data/workspace/shortcuts.cljs

@@ -440,12 +440,12 @@
    :increase-zoom        {:tooltip "+"
                           :command ["+" "="]
                           :subsections [:zoom-workspace]
-                          :fn #(st/emit! (dw/increase-zoom nil))}
+                          :fn #(st/emit! (dw/increase-zoom))}
 
    :decrease-zoom        {:tooltip "-"
                           :command ["-" "_"]
                           :subsections [:zoom-workspace]
-                          :fn #(st/emit! (dw/decrease-zoom nil))}
+                          :fn #(st/emit! (dw/decrease-zoom))}
 
    :reset-zoom           {:tooltip (ds/shift "0")
                           :command "shift+0"

frontend/src/app/main/data/workspace/zoom.cljs

@@ -28,20 +28,26 @@
         (update :vbox merge (select-keys vbox' [:x :y :width :height])))))
 
 (defn increase-zoom
-  [center]
+  ([]
-  (ptk/reify ::increase-zoom
+   (increase-zoom ::auto))
-    ptk/UpdateEvent
+  ([center]
-    (update [_ state]
+   (ptk/reify ::increase-zoom
-      (update state :workspace-local
+     ptk/UpdateEvent
-              #(impl-update-zoom % center (fn [z] (min (* z 1.3) 200)))))))
+     (update [_ state]
+       (let [center (if (= center ::auto) @ms/mouse-position center)]
+         (update state :workspace-local
+                 #(impl-update-zoom % center (fn [z] (min (* z 1.3) 200)))))))))
 
 (defn decrease-zoom
-  [center]
+  ([]
-  (ptk/reify ::decrease-zoom
+   (decrease-zoom ::auto))
-    ptk/UpdateEvent
+  ([center]
-    (update [_ state]
+   (ptk/reify ::decrease-zoom
-      (update state :workspace-local
+     ptk/UpdateEvent
-              #(impl-update-zoom % center (fn [z] (max (/ z 1.3) 0.01)))))))
+     (update [_ state]
+       (let [center (if (= center ::auto) @ms/mouse-position center)]
+         (update state :workspace-local
+                 #(impl-update-zoom % center (fn [z] (max (/ z 1.3) 0.01)))))))))
 
 (defn set-zoom
   [center scale]

frontend/src/app/main/ui/viewer/inspect/left_sidebar.cljs

@@ -7,6 +7,7 @@
 (ns app.main.ui.viewer.inspect.left-sidebar
   (:require
    [app.common.data :as d]
+   [app.common.types.shape.layout :as ctl]
    [app.main.data.viewer :as dv]
    [app.main.store :as st]
    [app.main.ui.components.shape-icon :as si]
@@ -34,7 +35,7 @@
                         (make-collapsed-iref id))
 
         expanded? (not (mf/deref collapsed-iref))
-
+        absolute? (ctl/layout-absolute? item)
         toggle-collapse
         (fn [event]
           (dom/stop-propagation event)
@@ -71,7 +72,10 @@
      [:div.element-list-body {:class (dom/classnames :selected selected?
                                                      :icon-layer (= (:type item) :icon))
                               :on-click select-shape}
-      [:& si/element-icon {:shape item}]
+      [:div.icon
+       (when absolute?
+         [:div.absolute i/position-absolute])
+       [:& si/element-icon {:shape item}]]
       [:& layer-name {:shape item :disabled-double-click true}]
 
       (when (and (not disable-collapse?) (:shapes item))

frontend/src/app/main/ui/workspace/colorpicker.cljs

@@ -65,11 +65,12 @@
 
         handle-change-color
         (mf/use-fn
-         (mf/deps @drag?)
+         (mf/deps current-color @drag?)
          (fn [color]
-           (let [recent-color (merge current-color color)
+           (when (not= (str/lower (:hex color)) (str/lower (:hex current-color)))
-                 recent-color (dc/materialize-color-components recent-color)]
+             (let [recent-color (merge current-color color)
-             (st/emit! (dc/update-colorpicker-color recent-color (not @drag?))))))
+                   recent-color (dc/materialize-color-components recent-color)]
+               (st/emit! (dc/update-colorpicker-color recent-color (not @drag?)))))))
 
         handle-click-picker
         (mf/use-fn

frontend/src/app/main/ui/workspace/shapes/text/editor.cljs

@@ -12,6 +12,7 @@
    [app.common.geom.shapes :as gsh]
    [app.common.geom.shapes.text :as gsht]
    [app.common.text :as txt]
+   [app.config :as cf]
    [app.main.data.workspace :as dw]
    [app.main.data.workspace.texts :as dwt]
    [app.main.refs :as refs]
@@ -271,6 +272,12 @@
         text-modifier
         (mf/deref text-modifier-ref)
 
+        ;; For Safari It's necesary to scale the editor with the zoom level to fix
+        ;; a problem with foreignObjects not scaling correctly with the viewbox
+        maybe-zoom
+        (when (cf/check-browser? :safari)
+          (mf/deref refs/selected-zoom))
+
         shape (cond-> shape
                 (some? text-modifier)
                 (dwt/apply-text-modifier text-modifier)
@@ -299,5 +306,7 @@
       [:div {:style {:position "fixed"
                      :left 0
                      :top  (- (:y shape) y)
-                     :pointer-events "all"}}
+                     :pointer-events "all"
+                     :transform-origin "top left"
+                     :transform (when maybe-zoom (dm/fmt "scale(%)" maybe-zoom))}}
        [:& text-shape-edit-html {:shape shape :key (str (:id shape))}]]]]))