From 1ec423c11d75995dee5f88f5d1e4160988747fd3 Mon Sep 17 00:00:00 2001
From: "alonso.torres" <alonso.torres@kaleidos.net>
Date: Mon, 26 Apr 2021 10:31:11 +0200
Subject: [PATCH] :bug: Fix problems with text editor selection

---
 CHANGES.md                                    |  1 +
 .../main/ui/workspace/shapes/text/editor.cljs | 20 +++++++++++++------
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/CHANGES.md b/CHANGES.md
index 9d849eebd..3a4624c98 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -30,6 +30,7 @@
 - Remove legacy system user and team [#843](https://github.com/penpot/penpot/issues/843)
 - Fix problem with zoom an selection rect [#845](https://github.com/penpot/penpot/issues/845)
 - Fix problem displaying team statistics [#859](https://github.com/penpot/penpot/issues/859)
+- Fix problems with text editor selection [Taiga #1546](https://tree.taiga.io/project/penpot/issue/1546)
 
 ### :arrow_up: Deps updates
 
diff --git a/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs b/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs
index f273d4aa0..edfd630e7 100644
--- a/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs
+++ b/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs
@@ -163,10 +163,18 @@
    ::mf/wrap-props false
    ::mf/forward-ref true}
   [props ref]
-  (let [{:keys [id x y width height grow-type] :as shape} (obj/get props "shape")]
-    [:foreignObject {:transform (gsh/transform-matrix shape)
-                     :x x :y y
-                     :width  (if (#{:auto-width} grow-type) 100000 width)
-                     :height (if (#{:auto-height :auto-width} grow-type) 100000 height)}
+  (let [{:keys [id x y width height grow-type] :as shape} (obj/get props "shape")
+        clip-id (str "clip-" id)]
+    [:g.text-editor {:clip-path (str "url(#" clip-id ")")}
+     [:defs
+      ;; This clippath will cut the huge foreign object we use to calculate the automatic resize
+      [:clipPath {:id clip-id}
+       [:rect {:x x :y y
+               :width (+ width 8) :height (+ height 8)
+               :transform (gsh/transform-matrix shape)}]]]
+     [:foreignObject {:transform (gsh/transform-matrix shape)
+                      :x x :y y
+                      :width  (if (#{:auto-width} grow-type) 100000 width)
+                      :height (if (#{:auto-height :auto-width} grow-type) 100000 height)}
 
-     [:& text-shape-edit-html {:shape shape :key (str id)}]]))
+      [:& text-shape-edit-html {:shape shape :key (str id)}]]]))