feature: Add WindowScroll, WindowVisibility, and WindowDimensions to uni-dom (#400)

## Summary

- Add `WindowScroll` for reactive scroll position tracking with 16ms
throttling (~60fps)
- Add `WindowVisibility` for document visibility state (tab switching,
minimizing)
- Add `WindowDimensions` for viewport and window size tracking on resize

All components follow the established `NetworkStatus` pattern with:
- Lazy singleton instances
- Proper cleanup via `stop()`
- Reactive `Rx` streams for integration with uni-dom's reactive system

## Test plan

- [x] `./sbt compile` passes
- [x] `./sbt "domTest/test"` passes (172 tests)
- [x] `./sbt scalafmtAll` applied

🤖 Generated with [Claude Code](https://claude.com/claude-code)

---------

Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>

Author: xerial

plans/wobbly-knitting-diffie.md

@@ -0,0 +1,187 @@
+# uni-dom Window Events Implementation Plan
+
+## Overview
+
+Add reactive window event bindings for scroll tracking, visibility state, and window dimensions to uni-dom. Follows the established patterns from MediaQuery and NetworkStatus.
+
+## Components
+
+### 1. WindowScroll - Scroll Position Tracking
+
+Reactive scroll position with built-in throttling for performance.
+
+**API:**
+```scala
+object WindowScroll:
+  def x: Double                      // Current horizontal scroll
+  def y: Double                      // Current vertical scroll
+  def scrollX: Rx[Double]            // Reactive horizontal position
+  def scrollY: Rx[Double]            // Reactive vertical position
+  def scroll: Rx[(Double, Double)]   // Combined (x, y) stream
+  def stop(): Unit                   // Cleanup
+```
+
+**Usage:**
+```scala
+// Show "back to top" button when scrolled
+div(
+  WindowScroll.scrollY.map { y =>
+    if y > 500 then button("Back to Top") else DomNode.empty
+  }
+)
+```
+
+**Implementation notes:**
+- Uses 16ms throttle (~60fps) for performance
+- Leading + trailing edge throttling ensures final position is captured
+- Private inner class with lazy val singleton
+
+### 2. WindowVisibility - Document Visibility State
+
+Track whether the page is visible or hidden (tab switching, minimizing).
+
+**API:**
+```scala
+object WindowVisibility:
+  def isVisible: Boolean             // Current visibility
+  def state: String                  // "visible", "hidden", etc.
+  def visible: Rx[Boolean]           // Reactive visibility
+  def hidden: Rx[Boolean]            // Inverse of visible
+  def visibilityState: Rx[String]    // Reactive state string
+  def stop(): Unit                   // Cleanup
+```
+
+**Usage:**
+```scala
+// Pause video when tab is hidden
+WindowVisibility.visible.run { visible =>
+  if visible then video.play() else video.pause()
+}
+```
+
+### 3. WindowDimensions - Window Size Tracking
+
+Reactive window dimensions with resize tracking.
+
+**API:**
+```scala
+object WindowDimensions:
+  def innerWidth: Int                // Viewport width
+  def innerHeight: Int               // Viewport height
+  def outerWidth: Int                // Full window width
+  def outerHeight: Int               // Full window height
+  def rxInnerWidth: Rx[Int]          // Reactive viewport width
+  def rxInnerHeight: Rx[Int]         // Reactive viewport height
+  def rxOuterWidth: Rx[Int]          // Reactive window width
+  def rxOuterHeight: Rx[Int]         // Reactive window height
+  def dimensions: Rx[(Int, Int)]     // Combined (width, height)
+  def stop(): Unit                   // Cleanup
+```
+
+**Usage:**
+```scala
+// Responsive layout without MediaQuery
+div(
+  WindowDimensions.rxInnerWidth.map { width =>
+    if width < 768 then "mobile-layout" else "desktop-layout"
+  }
+)
+```
+
+## Files to Create
+
+| File | Description |
+|------|-------------|
+| `uni/.js/src/main/scala/wvlet/uni/dom/WindowScroll.scala` | Scroll position tracking |
+| `uni/.js/src/main/scala/wvlet/uni/dom/WindowVisibility.scala` | Document visibility state |
+| `uni/.js/src/main/scala/wvlet/uni/dom/WindowDimensions.scala` | Window dimensions tracking |
+| `uni-dom-test/src/test/scala/wvlet/uni/dom/WindowScrollTest.scala` | Scroll tests |
+| `uni-dom-test/src/test/scala/wvlet/uni/dom/WindowVisibilityTest.scala` | Visibility tests |
+| `uni-dom-test/src/test/scala/wvlet/uni/dom/WindowDimensionsTest.scala` | Dimensions tests |
+
+## Files to Modify
+
+| File | Changes |
+|------|---------|
+| `uni/.js/src/main/scala/wvlet/uni/dom/all.scala` | Add exports for WindowScroll, WindowVisibility, WindowDimensions |
+
+## Implementation Pattern
+
+Follow the NetworkStatus pattern:
+
+```scala
+object WindowXxx:
+  private class XxxVar extends Cancelable:
+    private val underlying = Rx.variable(initialValue)
+    private val listener: js.Function1[dom.Event, Unit] = (_: dom.Event) =>
+      underlying := newValue
+
+    dom.window.addEventListener("event", listener)
+
+    def get: T = underlying.get
+    def rx: Rx[T] = underlying
+
+    override def cancel: Unit =
+      dom.window.removeEventListener("event", listener)
+
+  private lazy val instance: XxxVar = XxxVar()
+
+  def value: T = instance.get
+  def rxValue: Rx[T] = instance.rx
+  def stop(): Unit = instance.cancel
+```
+
+## Scroll Throttling Strategy
+
+```scala
+private var lastUpdateTime: Double = 0
+private var scheduledUpdate: js.UndefOr[Int] = js.undefined
+
+private val listener: js.Function1[dom.Event, Unit] = (_: dom.Event) =>
+  val now = js.Date.now()
+  if now - lastUpdateTime >= throttleMs then
+    // Leading edge: update immediately
+    lastUpdateTime = now
+    updateValues()
+  else if scheduledUpdate.isEmpty then
+    // Trailing edge: schedule final update
+    scheduledUpdate = dom.window.setTimeout(
+      () => {
+        scheduledUpdate = js.undefined
+        lastUpdateTime = js.Date.now()
+        updateValues()
+      },
+      throttleMs - (now - lastUpdateTime).toInt
+    )
+```
+
+## Implementation Order
+
+1. WindowVisibility (simplest, follows NetworkStatus exactly)
+2. WindowDimensions (similar, just more RxVars)
+3. WindowScroll (most complex due to throttling)
+4. Update all.scala exports
+5. Create tests
+
+## Verification
+
+```bash
+# In worktree
+cd /Users/leo/work/uni/.worktree/feature-window-events
+
+# Compile
+./sbt compile
+
+# Run tests
+./sbt "domTestJS/test"
+
+# Format
+./sbt scalafmtAll
+```
+
+## References
+
+Pattern files to follow:
+- `uni/.js/src/main/scala/wvlet/uni/dom/NetworkStatus.scala` - Primary pattern
+- `uni/.js/src/main/scala/wvlet/uni/dom/MediaQuery.scala` - Secondary pattern
+- `uni-dom-test/src/test/scala/wvlet/uni/dom/NetworkStatusTest.scala` - Test pattern

uni-dom-test/src/test/scala/wvlet/uni/dom/WindowDimensionsTest.scala

@@ -0,0 +1,98 @@
+/*
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+package wvlet.uni.dom
+
+import wvlet.uni.test.UniTest
+import wvlet.uni.dom.all.*
+import wvlet.uni.rx.Rx
+
+class WindowDimensionsTest extends UniTest:
+
+  test("WindowDimensions.innerWidth returns current viewport width"):
+    val width = WindowDimensions.innerWidth
+    width shouldMatch { case _: Int =>
+    }
+
+  test("WindowDimensions.innerHeight returns current viewport height"):
+    val height = WindowDimensions.innerHeight
+    height shouldMatch { case _: Int =>
+    }
+
+  test("WindowDimensions.outerWidth returns current window width"):
+    val width = WindowDimensions.outerWidth
+    width shouldMatch { case _: Int =>
+    }
+
+  test("WindowDimensions.outerHeight returns current window height"):
+    val height = WindowDimensions.outerHeight
+    height shouldMatch { case _: Int =>
+    }
+
+  test("WindowDimensions.rxInnerWidth returns Rx[Int]"):
+    val rx = WindowDimensions.rxInnerWidth
+    rx shouldMatch { case _: Rx[?] =>
+    }
+
+  test("WindowDimensions.rxInnerHeight returns Rx[Int]"):
+    val rx = WindowDimensions.rxInnerHeight
+    rx shouldMatch { case _: Rx[?] =>
+    }
+
+  test("WindowDimensions.rxOuterWidth returns Rx[Int]"):
+    val rx = WindowDimensions.rxOuterWidth
+    rx shouldMatch { case _: Rx[?] =>
+    }
+
+  test("WindowDimensions.rxOuterHeight returns Rx[Int]"):
+    val rx = WindowDimensions.rxOuterHeight
+    rx shouldMatch { case _: Rx[?] =>
+    }
+
+  test("WindowDimensions.dimensions returns Rx[(Int, Int)]"):
+    val rx = WindowDimensions.dimensions
+    rx shouldMatch { case _: Rx[?] =>
+    }
+
+  test("WindowDimensions can be used in reactive expressions"):
+    val sizeText = WindowDimensions
+      .rxInnerWidth
+      .map { width =>
+        if width < 768 then
+          "mobile"
+        else
+          "desktop"
+      }
+
+    var result = ""
+    sizeText.run { v =>
+      result = v
+    }
+
+    (result == "mobile" || result == "desktop") shouldBe true
+
+  test("WindowDimensions.dimensions provides both width and height"):
+    var widthResult  = 0
+    var heightResult = 0
+
+    WindowDimensions
+      .dimensions
+      .run { case (w, h) =>
+        widthResult = w
+        heightResult = h
+      }
+
+    (widthResult >= 0) shouldBe true
+    (heightResult >= 0) shouldBe true
+
+end WindowDimensionsTest

uni-dom-test/src/test/scala/wvlet/uni/dom/WindowScrollTest.scala

@@ -0,0 +1,77 @@
+/*
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+package wvlet.uni.dom
+
+import wvlet.uni.test.UniTest
+import wvlet.uni.dom.all.*
+import wvlet.uni.rx.Rx
+
+class WindowScrollTest extends UniTest:
+
+  test("WindowScroll.x returns current horizontal scroll position"):
+    val x = WindowScroll.x
+    x shouldMatch { case _: Double =>
+    }
+
+  test("WindowScroll.y returns current vertical scroll position"):
+    val y = WindowScroll.y
+    y shouldMatch { case _: Double =>
+    }
+
+  test("WindowScroll.scrollX returns Rx[Double]"):
+    val rx = WindowScroll.scrollX
+    rx shouldMatch { case _: Rx[?] =>
+    }
+
+  test("WindowScroll.scrollY returns Rx[Double]"):
+    val rx = WindowScroll.scrollY
+    rx shouldMatch { case _: Rx[?] =>
+    }
+
+  test("WindowScroll.scroll returns Rx[(Double, Double)]"):
+    val rx = WindowScroll.scroll
+    rx shouldMatch { case _: Rx[?] =>
+    }
+
+  test("WindowScroll can be used in reactive expressions"):
+    val showBackToTop = WindowScroll
+      .scrollY
+      .map { y =>
+        y > 500
+      }
+
+    var result = false
+    showBackToTop.run { v =>
+      result = v
+    }
+
+    result shouldMatch { case _: Boolean =>
+    }
+
+  test("WindowScroll.scroll provides both x and y positions"):
+    var xResult = 0.0
+    var yResult = 0.0
+
+    WindowScroll
+      .scroll
+      .run { case (x, y) =>
+        xResult = x
+        yResult = y
+      }
+
+    // In jsdom, scroll positions start at 0
+    (xResult >= 0) shouldBe true
+    (yResult >= 0) shouldBe true
+
+end WindowScrollTest