mirror of
https://github.com/penpot/penpot.git
synced 2025-03-13 00:01:51 -05:00
🐛 Fix text editor for Safari 17
This commit is contained in:
parent
919f6d246b
commit
9965fbc92b
2 changed files with 29 additions and 22 deletions
|
@ -22,7 +22,7 @@
|
|||
;; --- Auxiliar Functions
|
||||
|
||||
(def valid-browsers
|
||||
#{:chrome :firefox :safari :edge :other})
|
||||
#{:chrome :firefox :safari :safari-16 :safari-17 :edge :other})
|
||||
|
||||
(def valid-platforms
|
||||
#{:windows :linux :macos :other})
|
||||
|
@ -33,13 +33,17 @@
|
|||
check-chrome? (fn [] (str/includes? user-agent "chrom"))
|
||||
check-firefox? (fn [] (str/includes? user-agent "firefox"))
|
||||
check-edge? (fn [] (str/includes? user-agent "edg"))
|
||||
check-safari? (fn [] (str/includes? user-agent "safari"))]
|
||||
check-safari? (fn [] (str/includes? user-agent "safari"))
|
||||
check-safari-16? (fn [] (and (check-safari?) (str/includes? user-agent "version/16")))
|
||||
check-safari-17? (fn [] (and (check-safari?) (str/includes? user-agent "version/17")))]
|
||||
(cond
|
||||
(check-edge?) :edge
|
||||
(check-chrome?) :chrome
|
||||
(check-firefox?) :firefox
|
||||
(check-safari?) :safari
|
||||
:else :other)))
|
||||
(check-edge?) :edge
|
||||
(check-chrome?) :chrome
|
||||
(check-firefox?) :firefox
|
||||
(check-safari-16?) :safari-16
|
||||
(check-safari-17?) :safari-17
|
||||
(check-safari?) :safari
|
||||
:else :other)))
|
||||
|
||||
(defn- parse-platform
|
||||
[]
|
||||
|
@ -130,7 +134,9 @@
|
|||
|
||||
(defn ^boolean check-browser? [candidate]
|
||||
(dm/assert! (contains? valid-browsers candidate))
|
||||
(= candidate browser))
|
||||
(if (= candidate :safari)
|
||||
(contains? #{:safari :safari-16 :safari-17} browser)
|
||||
(= candidate browser)))
|
||||
|
||||
(defn ^boolean check-platform? [candidate]
|
||||
(dm/assert! (contains? valid-platforms candidate))
|
||||
|
|
|
@ -281,7 +281,7 @@
|
|||
;; NOTE: this teoretically breaks hooks rules, but in practice
|
||||
;; it is imposible to really break it
|
||||
maybe-zoom
|
||||
(when (cf/check-browser? :safari)
|
||||
(when (cf/check-browser? :safari-16)
|
||||
(mf/deref refs/selected-zoom))
|
||||
|
||||
shape (cond-> shape
|
||||
|
@ -300,26 +300,27 @@
|
|||
width (mth/max (dm/get-prop bounds :width)
|
||||
(dm/get-prop shape :width))
|
||||
height (mth/max (dm/get-prop bounds :height)
|
||||
(dm/get-prop shape :height))]
|
||||
(dm/get-prop shape :height))
|
||||
|
||||
style
|
||||
(cond-> #js {:pointer-events "all"}
|
||||
(cf/check-browser? :safari-16)
|
||||
(obj/merge!
|
||||
#js {:position "fixed"
|
||||
:left 0
|
||||
:top (- (dm/get-prop shape :y) y)
|
||||
:transform-origin "top left"
|
||||
:transform (when (some? maybe-zoom)
|
||||
(dm/fmt "scale(%)" maybe-zoom))}))]
|
||||
|
||||
[:g.text-editor {:clip-path (dm/fmt "url(#%)" clip-id)
|
||||
:transform (dm/str (gsh/transform-matrix shape))}
|
||||
[:defs
|
||||
[:clipPath {:id clip-id}
|
||||
[:rect {:x x
|
||||
:y y
|
||||
:width width
|
||||
:height height
|
||||
:fill "red"}]]]
|
||||
[:rect {:x x :y y :width width :height height}]]]
|
||||
|
||||
[:foreignObject {:x x :y y :width width :height height}
|
||||
[:div {:style {:position "fixed"
|
||||
:left 0
|
||||
:top (- (dm/get-prop shape :y) y)
|
||||
:pointer-events "all"
|
||||
:transform-origin "top left"
|
||||
:transform (when (some? maybe-zoom)
|
||||
(dm/fmt "scale(%)" maybe-zoom))}}
|
||||
[:div {:style style}
|
||||
[:& text-shape-edit-html
|
||||
{:shape shape
|
||||
:key (dm/str shape-id)}]]]]))
|
||||
|
|
Loading…
Add table
Reference in a new issue