Merge pull request #8830 from penpot/superalex-fix-text-selection-on-vertical-align-middle-bottom

🐛 Fix text selection on vertical align middle/bottom
This commit is contained in:
Aitor Moreno
2026-03-30 17:15:11 +02:00
committed by GitHub

View File

@@ -205,6 +205,19 @@
(dwt/dispose! instance)
(st/emit! (dwt/update-editor nil)))))
(defn vertical-align-editor-classes
"Returns `[align-top? align-center? align-bottom?]` for the text editor root
flex layout. When `render-wasm?` is true, the `foreignObject` is already
positioned using the same vertical offset as Skia (`content_rect`); applying
`justify-content` center/end here would double the offset and misalign the DOM
editor with the rendered text, caret, and selection."
[content render-wasm?]
(if render-wasm?
[true false false]
[(= (:vertical-align content "top") "top")
(= (:vertical-align content) "center")
(= (:vertical-align content) "bottom")]))
(defn get-color-from-content [content]
(let [fills (->> (tree-seq map? :children content)
(mapcat :fills)
@@ -225,7 +238,7 @@
"Text editor (HTML)"
{::mf/wrap [mf/memo]
::mf/props :obj}
[{:keys [shape canvas-ref]}]
[{:keys [shape canvas-ref render-wasm?] :or {render-wasm? false}}]
(let [content (:content shape)
shape-id (dm/get-prop shape :id)
fill-color (get-color-from-content content)
@@ -244,6 +257,9 @@
text-color (or fill-color (get-default-text-color {:frame frame
:background-color background-color}) color/black)
[align-top? align-center? align-bottom?]
(vertical-align-editor-classes content render-wasm?)
fonts
(-> (mf/use-memo (mf/deps content) #(get-fonts content))
(h/use-equal-memo))]
@@ -291,9 +307,9 @@
:grow-type-fixed (= (:grow-type shape) :fixed)
:grow-type-auto-width (= (:grow-type shape) :auto-width)
:grow-type-auto-height (= (:grow-type shape) :auto-height)
:align-top (= (:vertical-align content "top") "top")
:align-center (= (:vertical-align content) "center")
:align-bottom (= (:vertical-align content) "bottom")))
:align-top align-top?
:align-center align-center?
:align-bottom align-bottom?))
:ref editor-ref
:data-testid "text-editor-content"
:data-x (dm/get-prop shape :x)
@@ -435,4 +451,5 @@
[:div {:style style}
[:& text-editor-html {:shape shape
:canvas-ref canvas-ref
:render-wasm? render-wasm?
:key (dm/str shape-id)}]]]]))