@solidrt/core 0.0.50 → 0.0.51

package/src/window.ts

@@ -1,5 +1,5 @@
 import { createSignal, onCleanup, onSettled, flush } from "@solidjs/signals"
-import { requestFrame } from "flux:rendertree"
+import { requestFrame, setPointerLock } from "flux:rendertree"
 import { renderFrame } from "srt:render"
 import { on, once } from "srt:events"
 import { exit } from "srt:app"
@@ -38,9 +38,12 @@ let refreshRate = 60
  * the present count, and `rate` is the current refresh rate in Hz. `tick` is paced
  * by the runtime (one refresh period per present, slow-corrected toward the wall
  * clock) so animations driven off it stay smooth even when swap-return times
- * jitter. performance.now() and timers report/march on this same paced timeline
- * (so the whole time surface freezes together under the dev tools' clock
- * control); for real wall-clock time use Date.now().
+ * jitter, and it is continuous across hot reloads: every tick an instance
+ * sees is on one timebase, so dt is well-defined from the second call on.
+ * Timers freeze together with frame callbacks under the dev tools' clock
+ * control, but measure their delays against the wall clock, not this paced
+ * timeline. performance.now() is not on it either: it is real elapsed time
+ * for measuring work; Date.now() is calendar time.
  * Returns a cleanup function; also auto-cleans within a reactive scope.
  */
 export function onFrame(fn: (tick: number, frame: number, rate: number) => void) {
@@ -161,6 +164,33 @@ export function windowFocused(): boolean {
   return focusedAccessor()
 }
 
+/**
+ * Lock the pointer to the window (relative mouse mode) or release it. While
+ * locked the cursor is hidden and confined, clientX/clientY freeze at the
+ * lock point, and mouse motion keeps reporting through the pointer events'
+ * movementX/movementY - the mouse-look primitive. Window-level, no
+ * permission dance: one app, one window. Observe the applied state through
+ * pointerLocked(); the platform can refuse (no relative mode) and the OS
+ * may drop the lock, e.g. on focus loss.
+ */
+export function lockPointer(locked: boolean) {
+  if (typeof locked !== "boolean") throw new Error(`lockPointer: expected a boolean, got ${typeof locked}`)
+  setPointerLock(locked)
+}
+
+let pointerLockedAccessor: (() => boolean) | undefined
+
+/** Whether the pointer is currently locked (relative mouse mode), as a reactive accessor. */
+export function pointerLocked(): boolean {
+  if (!pointerLockedAccessor) {
+    let [locked, setLocked] = createSignal(false)
+    // Sticky event: a subscriber after the lock still observes the state.
+    on("pointerLock", ({ locked }: { locked: boolean }) => setLocked(locked))
+    pointerLockedAccessor = locked
+  }
+  return pointerLockedAccessor()
+}
+
 let keyboardHeightAccessor: (() => number) | undefined
 
 /**
@@ -255,6 +285,7 @@ export function attachWindow(nodeId: number) {
   let unsubEnter: () => void = null!
   let unsubLeave: () => void = null!
   let unsubWheel: () => void = null!
+  let unsubTransitionEnd: () => void = null!
   let unsubKeyDown: () => void = null!
   let unsubKeyUp: () => void = null!
   let unsubBack: () => void = null!
@@ -263,8 +294,16 @@ export function attachWindow(nodeId: number) {
   let unsubRefreshRate: () => void = null!
   let unsubFirstResize: (() => void) | null = null
 
-  function runFrame(t: number, frame: number) {
-    if (animationFrames.size > 0) {
+  // `bootstrap` marks the synthetic first frame (see the first-resize
+  // subscription below): it flushes and paints the freshly initialized graph
+  // but does not invoke onFrame callbacks, because its timestamp is not a
+  // reading of the frame timeline - handing apps a zero tick gave every
+  // reloaded instance one enormous dt on the next real frame
+  // (okf/done/onframe-tick-reset-on-reload.md). The callbacks stay
+  // registered and run on the first real render event, before the first
+  // paint with their writes applied.
+  function runFrame(t: number, frame: number, bootstrap = false) {
+    if (!bootstrap && animationFrames.size > 0) {
       let frames = animationFrames
       animationFrames = new Map()
       for (let fn of frames.values()) fn(t, frame, refreshRate)
@@ -368,6 +407,17 @@ export function attachWindow(nodeId: number) {
       bubble(raw, "onWheel")
     })
 
+    // A native transition finished (runtime-side animation; see the
+    // `transition` prop). Target-only delivery, no bubbling: the element
+    // that declared the transition is the one interested in its end.
+    unsubTransitionEnd = on("transitionEnd", (raw: { target: number; property: string }) => {
+      try {
+        getEventHandler(raw.target, "onTransitionEnd")?.({ property: raw.property })
+      } catch (err) {
+        console.error("Error in onTransitionEnd handler:", err)
+      }
+    })
+
     // Key events dispatch along the focused node's ancestor chain, leaf->root
     // (the pointer bubbling contract), so a container hears keys from focused
     // descendants and the window root hears everything: <window onKeyDown> is
@@ -429,7 +479,7 @@ export function attachWindow(nodeId: number) {
     // where flush() is illegal (not reentrant). Defer runFrame to a microtask
     // so the first frame always runs after this callback returns.
     unsubFirstResize = once("resize", () => {
-      queueMicrotask(() => runFrame(0, 0))
+      queueMicrotask(() => runFrame(0, 0, true))
     })
   })
 
@@ -442,6 +492,7 @@ export function attachWindow(nodeId: number) {
     if (unsubEnter) unsubEnter()
     if (unsubLeave) unsubLeave()
     if (unsubWheel) unsubWheel()
+    if (unsubTransitionEnd) unsubTransitionEnd()
     if (unsubKeyDown) unsubKeyDown()
     if (unsubKeyUp) unsubKeyUp()
     if (unsubBack) unsubBack()