github/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2026-09-13 23:48:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

♻️ Migrate viewer/interactions viewport components to modern syntax (#9442)

Browse Source 
Signed-off-by: Andrey Antukh <niwi@niwi.nz>
Co-authored-by: Andrey Antukh <niwi@niwi.nz>
This commit is contained in:
Dexterity 2026-06-10 07:46:25 -04:00 committed by GitHub
parent 6937e70dab
commit 5d2e0cb7cb
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 30 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/app/main/ui/viewer.cljs
View File

@ -186,7 +186,7 @@
:style {:width (:width size) :style {:width (:width size)
:height (:height size) :height (:height size)
:position "fixed"}} :position "fixed"}}
[:& interactions/viewport [:> interactions/viewport*
{:frame overlay-frame {:frame overlay-frame
:base-frame frame :base-frame frame
:frame-offset overlay-position :frame-offset overlay-position
@ -201,7 +201,7 @@
:height (:height size) :height (:height size)
:left (* (:x overlay-position) zoom) :left (* (:x overlay-position) zoom)
:top (* (:y overlay-position) zoom)}} :top (* (:y overlay-position) zoom)}}
[:& interactions/viewport [:> interactions/viewport*
{:frame overlay-frame {:frame overlay-frame
:base-frame frame :base-frame frame
:frame-offset overlay-position :frame-offset overlay-position
@ -236,7 +236,7 @@
:height (:height orig-size) :height (:height orig-size)
:position "relative"}} :position "relative"}}
[:& interactions/viewport [:> interactions/viewport*
{:frame orig-frame {:frame orig-frame
:base-frame orig-frame :base-frame orig-frame
:frame-offset (gpt/point 0 0) :frame-offset (gpt/point 0 0)
@ -251,7 +251,7 @@
:height (:height size) :height (:height size)
:position "relative"}} :position "relative"}}
[:& interactions/viewport [:> interactions/viewport*
{:frame frame {:frame frame
:base-frame frame :base-frame frame
:frame-offset (gpt/point 0 0) :frame-offset (gpt/point 0 0)

60
frontend/src/app/main/ui/viewer/interactions.cljs
View File

@ -29,23 +29,16 @@
[goog.events :as events] [goog.events :as events]
[rumext.v2 :as mf])) [rumext.v2 :as mf]))
(mf/defc viewport-svg (mf/defc viewport-svg*
{::mf/wrap [mf/memo] {::mf/wrap [mf/memo]}
::mf/wrap-props false} [{:keys [page frame base offset size is-fixed delta]}]
[props] (let [delta (or delta (gpt/point 0 0))
(let [page (unchecked-get props "page")
frame (unchecked-get props "frame")
base (unchecked-get props "base")
offset (unchecked-get props "offset")
size (unchecked-get props "size")
fixed? (unchecked-get props "fixed?")
delta (or (unchecked-get props "delta") (gpt/point 0 0))
vbox (:vbox size) vbox (:vbox size)
frame (cond-> frame fixed? (assoc :fixed-scroll true)) frame (cond-> frame is-fixed (assoc :fixed-scroll true))
objects (:objects page) objects (:objects page)
objects (cond-> objects fixed? (assoc-in [(:id frame) :fixed-scroll] true)) objects (cond-> objects is-fixed (assoc-in [(:id frame) :fixed-scroll] true))
fixed-ids (vpc/get-fixed-ids objects) fixed-ids (vpc/get-fixed-ids objects)
@ -96,7 +89,7 @@
[:& (mf/provider shapes/base-frame-ctx) {:value base} [:& (mf/provider shapes/base-frame-ctx) {:value base}
[:& (mf/provider shapes/frame-offset-ctx) {:value offset} [:& (mf/provider shapes/frame-offset-ctx) {:value offset}
(if fixed? (if is-fixed
[:svg {:class (stl/css :fixed) [:svg {:class (stl/css :fixed)
:view-box vbox :view-box vbox
:width (:width size) :width (:width size)
@ -132,23 +125,22 @@
:fill "none"} :fill "none"}
[:& wrapper-not-fixed {:shape frame :view-box vbox}]]])]])) [:& wrapper-not-fixed {:shape frame :view-box vbox}]]])]]))
(mf/defc viewport (mf/defc viewport*
{::mf/wrap [mf/memo] {::mf/wrap [mf/memo]}
::mf/wrap-props false} [{:keys [interactions-mode frame-offset size delta page frame base-frame is-fixed]}]
[props]
(let [;; NOTE: with `use-equal-memo` hook we ensure that all values (let [;; NOTE: with `use-equal-memo` hook we ensure that all values
;; conserves the reference identity for avoid unnecessary ;; conserves the reference identity for avoid unnecessary
;; dummy rerenders. ;; dummy rerenders.
mode (h/use-equal-memo (unchecked-get props "interactions-mode")) mode (h/use-equal-memo interactions-mode)
offset (h/use-equal-memo (unchecked-get props "frame-offset")) offset (h/use-equal-memo frame-offset)
size (h/use-equal-memo (unchecked-get props "size")) size (h/use-equal-memo size)
delta (unchecked-get props "delta") delta (h/use-equal-memo delta)
page (unchecked-get props "page") page (h/use-equal-memo page)
frame (unchecked-get props "frame") frame (h/use-equal-memo frame)
base (unchecked-get props "base-frame") base (h/use-equal-memo base-frame)
fixed? (unchecked-get props "fixed?") is-fixed (h/use-equal-memo is-fixed)
render-wasm? (and (features/use-feature "render-wasm/v1") render-wasm? (and (features/use-feature "render-wasm/v1")
(contains? cf/flags :available-viewer-wasm))] (contains? cf/flags :available-viewer-wasm))]
@ -193,14 +185,14 @@
:offset offset :offset offset
:size size :size size
:delta delta :delta delta
:fixed? fixed?}] :fixed? is-fixed}]
[:& viewport-svg {:page page [:> viewport-svg* {:page page
:frame frame :frame frame
:base base :base base
:offset offset :offset offset
:size size :size size
:delta delta :delta delta
:fixed? fixed?}]))) :is-fixed is-fixed}])))
(mf/defc flows-menu* (mf/defc flows-menu*
{::mf/wrap [mf/memo]} {::mf/wrap [mf/memo]}