Fix hover/click of scrolled elements/viewport

examples/scroll.rs

@@ -19,6 +19,10 @@ fn root() -> Element {
             align-items: center;
             color: white;
         }
+        
+        .gap:hover {
+            background: red;
+        }
 
         .not-scrollable {
             background-color: yellow;
@@ -35,6 +39,7 @@ fn root() -> Element {
             }
             div {
                 class: "gap",
+                onclick: |_| println!("Gap clicked!"),
                 "gap"
             }
             div {

packages/dioxus-blitz/src/window.rs

@@ -190,8 +190,9 @@ impl<Doc: DocumentLike> View<Doc> {
     }
 
     pub fn mouse_move(&mut self, x: f32, y: f32) -> bool {
-        let dom_x = x / self.viewport.zoom();
-        let dom_y = y / self.viewport.zoom();
+        let viewport_scroll = self.dom.as_ref().viewport_scroll();
+        let dom_x = x + viewport_scroll.x as f32 / self.viewport.zoom();
+        let dom_y = y + viewport_scroll.y as f32 / self.viewport.zoom();
 
         // println!("Mouse move: ({}, {})", x, y);
         // println!("Unscaled: ({}, {})",);

packages/dom/src/node.rs

@@ -782,11 +782,15 @@ impl Node {
     /// TODO: z-index
     /// (If multiple children are positioned at the position then a random one will be recursed into)
     pub fn hit(&self, x: f32, y: f32) -> Option<HitResult> {
-        let x = x - self.final_layout.location.x;
-        let y = y - self.final_layout.location.y;
+        let x = x - self.final_layout.location.x + self.scroll_offset.x as f32;
+        let y = y - self.final_layout.location.y + self.scroll_offset.y as f32;
 
         let size = self.final_layout.size;
-        if x < 0.0 || x > size.width || y < 0.0 || y > size.height {
+        if x < 0.0
+            || x > size.width + self.scroll_offset.x as f32
+            || y < 0.0
+            || y > size.height + self.scroll_offset.y as f32
+        {
             return None;
         }