@downdraft/engine 0.0.0 → 0.1.1

package/modules/native-osr/src/input-router.ts

@@ -0,0 +1,401 @@
+// ============================================================================
+// OSR Input Router — Raycasts against billboards and forwards input to OSR windows
+// ============================================================================
+
+import { invertMat4Into, transformMat4Vec4 } from "@downdraft/engine";
+import type { AtlasLayout, OSRInputEvent, OSRRendererStatus, WorldSpaceUIElement } from "./types";
+import type { CameraState } from "./world-space-ui-pass";
+
+export interface MouseState {
+  x: number;
+  y: number;
+  buttons: number; // bitmask: 1=left, 2=right, 4=middle
+  deltaX: number;
+  deltaY: number;
+  wheelDeltaX: number;
+  wheelDeltaY: number;
+}
+
+export interface InputRouterConfig {
+  /** Map of textureIndex → rendererId */
+  textureIndexToRendererId: Map<number, string>;
+  /** Map of rendererId → atlas layout (for atlas-mode renderers) */
+  atlasLayouts: Map<string, AtlasLayout>;
+  /** Map of rendererId → status */
+  rendererStatuses: Map<string, OSRRendererStatus>;
+  /** Map of rendererId → texture pixel dimensions */
+  rendererDimensions: Map<string, { width: number; height: number }>;
+}
+
+export class OSRInputRouter {
+  private config: InputRouterConfig;
+  private sendInputEvent: (rendererId: string, event: Omit<OSRInputEvent, "rendererId">) => void;
+  private hoveredElementId: string | null = null;
+  private hoveredRendererId: string | null = null;
+  private forcedFocusRendererId: string | null = null;
+  private forcedFocusTextureIndex: number = -1;
+  private forcedFocusCanvasWidth = 0;
+  private forcedFocusCanvasHeight = 0;
+  private lastMouseX = -1;
+  private lastMouseY = -1;
+  private lastButtons = 0;
+
+  constructor(
+    config: InputRouterConfig,
+    sendInputEvent: (rendererId: string, event: Omit<OSRInputEvent, "rendererId">) => void,
+  ) {
+    this.config = config;
+    this.sendInputEvent = sendInputEvent;
+  }
+
+  updateConfig(config: InputRouterConfig): void {
+    this.config = config;
+  }
+
+  /**
+   * Processes mouse state and forwards events to the appropriate OSR renderer.
+   * Uses raycasting to determine which billboard the mouse is hovering over.
+   */
+  handleMouse(camera: CameraState, mouse: MouseState, elements: WorldSpaceUIElement[]): void {
+    // Forced focus mode: raycast for position, always forward to focused renderer
+    if (this.forcedFocusRendererId) {
+      this.handleMouseForced(camera, mouse, elements);
+      return;
+    }
+
+    // Simple raycast: project mouse to world ray and test against billboard planes
+    const hit = this.raycastBillboards(camera, mouse, elements);
+    const rendererId = hit ? this.config.textureIndexToRendererId.get(hit.element.textureIndex) : null;
+
+    // Skip if renderer is crashed or failed
+    if (rendererId) {
+      const status = this.config.rendererStatuses.get(rendererId);
+      if (status === "crashed" || status === "failed") return;
+    }
+
+    // Mouse move
+    if (mouse.x !== this.lastMouseX || mouse.y !== this.lastMouseY) {
+      if (hit && rendererId) {
+        const coords = this.computeRendererCoords(hit);
+        this.sendInputEvent(rendererId, {
+          type: "mouseMove",
+          x: coords.x,
+          y: coords.y,
+          button: "left",
+        });
+        this.hoveredRendererId = rendererId;
+      } else {
+        this.hoveredRendererId = null;
+      }
+      this.lastMouseX = mouse.x;
+      this.lastMouseY = mouse.y;
+    }
+
+    // Mouse button changes
+    const buttonChanged = mouse.buttons !== this.lastButtons;
+    if (buttonChanged) {
+      const prevButtons = this.lastButtons;
+      const currButtons = mouse.buttons;
+
+      if (hit && rendererId) {
+        const coords = this.computeRendererCoords(hit);
+
+        // Left button
+        if ((currButtons & 1) && !(prevButtons & 1)) {
+          this.sendInputEvent(rendererId, { type: "mouseDown", x: coords.x, y: coords.y, button: "left" });
+          this.hoveredElementId = hit.element.id;
+          this.hoveredRendererId = rendererId;
+        } else if (!(currButtons & 1) && (prevButtons & 1)) {
+          this.sendInputEvent(rendererId, { type: "mouseUp", x: coords.x, y: coords.y, button: "left" });
+        }
+
+        // Right button
+        if ((currButtons & 2) && !(prevButtons & 2)) {
+          this.sendInputEvent(rendererId, { type: "mouseDown", x: coords.x, y: coords.y, button: "right" });
+        } else if (!(currButtons & 2) && (prevButtons & 2)) {
+          this.sendInputEvent(rendererId, { type: "mouseUp", x: coords.x, y: coords.y, button: "right" });
+        }
+
+        // Middle button
+        if ((currButtons & 4) && !(prevButtons & 4)) {
+          this.sendInputEvent(rendererId, { type: "mouseDown", x: coords.x, y: coords.y, button: "middle" });
+        } else if (!(currButtons & 4) && (prevButtons & 4)) {
+          this.sendInputEvent(rendererId, { type: "mouseUp", x: coords.x, y: coords.y, button: "middle" });
+        }
+      } else if (this.hoveredRendererId) {
+        // Mouse released outside any billboard — send mouseUp to last hovered
+        this.sendInputEvent(this.hoveredRendererId, { type: "mouseUp", x: 0, y: 0, button: "left" });
+        this.hoveredElementId = null;
+        this.hoveredRendererId = null;
+      }
+
+      this.lastButtons = currButtons;
+    }
+
+    // Mouse wheel
+    if (mouse.wheelDeltaY !== 0 || mouse.wheelDeltaX !== 0) {
+      if (hit && rendererId) {
+        const coords = this.computeRendererCoords(hit);
+        this.sendInputEvent(rendererId, {
+          type: "mouseWheel",
+          x: coords.x,
+          y: coords.y,
+          deltaX: mouse.wheelDeltaX,
+          deltaY: mouse.wheelDeltaY,
+        });
+      }
+    }
+  }
+
+  /**
+   * Forced focus mode: raycasts for accurate mouse position on the billboard,
+   * but always forwards events to the forced-focus renderer (regardless of which
+   * billboard the raycast hits).
+   */
+  private handleMouseForced(camera: CameraState, mouse: MouseState, elements: WorldSpaceUIElement[]): void {
+    const rendererId = this.forcedFocusRendererId!;
+
+    // Raycast to get accurate UV coordinates on the billboard
+    const hit = this.raycastBillboards(camera, mouse, elements);
+    const coords = hit ? this.computeRendererCoords(hit) : null;
+
+    // Mouse move
+    if (mouse.x !== this.lastMouseX || mouse.y !== this.lastMouseY) {
+      if (coords) {
+        this.sendInputEvent(rendererId, { type: "mouseMove", x: coords.x, y: coords.y, button: "left" });
+      }
+      this.lastMouseX = mouse.x;
+      this.lastMouseY = mouse.y;
+    }
+
+    // Mouse button changes
+    const buttonChanged = mouse.buttons !== this.lastButtons;
+    if (buttonChanged) {
+      const prevButtons = this.lastButtons;
+      const currButtons = mouse.buttons;
+      if (coords) {
+        // Left button
+        if ((currButtons & 1) && !(prevButtons & 1)) {
+          this.sendInputEvent(rendererId, { type: "mouseDown", x: coords.x, y: coords.y, button: "left" });
+        } else if (!(currButtons & 1) && (prevButtons & 1)) {
+          this.sendInputEvent(rendererId, { type: "mouseUp", x: coords.x, y: coords.y, button: "left" });
+        }
+
+        // Right button
+        if ((currButtons & 2) && !(prevButtons & 2)) {
+          this.sendInputEvent(rendererId, { type: "mouseDown", x: coords.x, y: coords.y, button: "right" });
+        } else if (!(currButtons & 2) && (prevButtons & 2)) {
+          this.sendInputEvent(rendererId, { type: "mouseUp", x: coords.x, y: coords.y, button: "right" });
+        }
+
+        // Middle button
+        if ((currButtons & 4) && !(prevButtons & 4)) {
+          this.sendInputEvent(rendererId, { type: "mouseDown", x: coords.x, y: coords.y, button: "middle" });
+        } else if (!(currButtons & 4) && (prevButtons & 4)) {
+          this.sendInputEvent(rendererId, { type: "mouseUp", x: coords.x, y: coords.y, button: "middle" });
+        }
+      }
+
+      this.lastButtons = currButtons;
+    }
+
+    // Mouse wheel
+    if (mouse.wheelDeltaY !== 0 || mouse.wheelDeltaX !== 0) {
+      if (coords) {
+        this.sendInputEvent(rendererId, {
+          type: "mouseWheel",
+          x: coords.x,
+          y: coords.y,
+          deltaX: mouse.wheelDeltaX,
+          deltaY: mouse.wheelDeltaY,
+        });
+      }
+    }
+  }
+
+  /**
+   * Manually focus the first available billboard renderer (bypasses raycasting).
+   * Sets forced focus mode so all mouse/keyboard events are forwarded to this renderer.
+   */
+  focusBillboard(): string | null {
+    for (const [texIdx, rendererId] of this.config.textureIndexToRendererId.entries()) {
+      const status = this.config.rendererStatuses.get(rendererId);
+      if (status === "crashed" || status === "failed") continue;
+      this.hoveredRendererId = rendererId;
+      this.hoveredElementId = `manual-focus-${texIdx}`;
+      this.forcedFocusRendererId = rendererId;
+      this.forcedFocusTextureIndex = texIdx;
+      return rendererId;
+    }
+    return null;
+  }
+
+  /** Set canvas dimensions for proportional mouse mapping in forced focus mode. */
+  setForcedFocusCanvasSize(w: number, h: number): void {
+    this.forcedFocusCanvasWidth = w;
+    this.forcedFocusCanvasHeight = h;
+  }
+
+  /** Check if forced focus mode is active. */
+  isForcedFocus(): boolean {
+    return this.forcedFocusRendererId !== null;
+  }
+
+  /** Check if the mouse is currently hovering over a billboard. */
+  isHoveringBillboard(): boolean {
+    return this.hoveredRendererId !== null;
+  }
+
+  /** Exit forced focus mode, return to raycast-based input. */
+  unfocusBillboard(): void {
+    this.forcedFocusRendererId = null;
+    this.forcedFocusTextureIndex = -1;
+    this.hoveredElementId = null;
+    this.hoveredRendererId = null;
+  }
+
+  /** Forwards a keyboard event to the currently focused/hovered renderer. */
+  handleKey(type: "keyDown" | "keyUp", keyCode: string, modifiers?: string[]): void {
+    if (!this.hoveredRendererId) return;
+    const status = this.config.rendererStatuses.get(this.hoveredRendererId);
+    if (status === "crashed" || status === "failed") return;
+
+    this.sendInputEvent(this.hoveredRendererId, { type, x: 0, y: 0, keyCode, modifiers });
+  }
+
+  private computeRendererCoords(hit: RaycastHit): { x: number; y: number } {
+    const rendererId = this.config.textureIndexToRendererId.get(hit.element.textureIndex);
+    if (!rendererId) return { x: 0, y: 0 };
+
+    // For atlas mode: map UV to atlas pixel coordinates
+    const layout = this.config.atlasLayouts.get(rendererId);
+    if (layout) {
+      // UV within the panel = (hit.uv - uvOffset) / uvScale → panel-relative UV
+      const panelU = (hit.uv[0] - hit.element.uvOffset[0]) / hit.element.uvScale[0];
+      const panelV = (hit.uv[1] - hit.element.uvOffset[1]) / hit.element.uvScale[1];
+
+      // Find which panel this UV falls within
+      for (const [, rect] of layout.panels.entries()) {
+        const panelX = rect.x / layout.width;
+        const panelY = rect.y / layout.height;
+        const panelW = rect.w / layout.width;
+        const panelH = rect.h / layout.height;
+
+        if (panelU >= panelX && panelU <= panelX + panelW &&
+            panelV >= panelY && panelV <= panelY + panelH) {
+          // Map to atlas-space pixels — the surface is one document with
+          // panels positioned at their rects, so events carry atlas coords.
+          const x = (panelU - panelX) / panelW * rect.w + rect.x;
+          const y = (panelV - panelY) / panelH * rect.h + rect.y;
+          return { x, y };
+        }
+      }
+    }
+
+    // For dedicated mode: map UV directly to texture pixel coordinates
+    // Flip Y: UV origin is bottom-left, DOM origin is top-left
+    const dims = this.config.rendererDimensions.get(rendererId);
+    const w = dims?.width ?? 512;
+    const h = dims?.height ?? 384;
+    return { x: hit.uv[0] * w, y: (1 - hit.uv[1]) * h };
+  }
+
+  private raycastBillboards(
+    camera: CameraState,
+    mouse: MouseState,
+    elements: WorldSpaceUIElement[],
+  ): RaycastHit | null {
+    if (elements.length === 0) return null;
+
+    // Convert mouse screen coords to NDC (-1 to 1)
+    // mouse.x/y are in canvas pixels (top-left origin)
+    const ndcX = (mouse.x / camera.canvasWidth) * 2.0 - 1.0;
+    const ndcY = -((mouse.y / camera.canvasHeight) * 2.0 - 1.0); // flip Y (NDC bottom-up)
+
+    // Build inverse of viewProj to unproject NDC → world
+    const vp = camera.viewProj;
+    const inv = new Float32Array(16);
+    if (!invertMat4Into(vp, inv)) return null;
+
+    // Ray origin = camera position
+    // Ray direction = unproject NDC point at far plane, normalize
+    const nearPoint = transformMat4Vec4(inv, [ndcX, ndcY, -1, 1]);
+    const farPoint = transformMat4Vec4(inv, [ndcX, ndcY, 1, 1]);
+    if (nearPoint[3] === 0 || farPoint[3] === 0) return null;
+
+    // Perspective divide
+    const nx = nearPoint[0] / nearPoint[3];
+    const ny = nearPoint[1] / nearPoint[3];
+    const nz = nearPoint[2] / nearPoint[3];
+    const fx = farPoint[0] / farPoint[3];
+    const fy = farPoint[1] / farPoint[3];
+    const fz = farPoint[2] / farPoint[3];
+
+    // Ray direction
+    let dx = fx - nx;
+    let dy = fy - ny;
+    let dz = fz - nz;
+    const dlen = Math.sqrt(dx * dx + dy * dy + dz * dz);
+    if (dlen === 0) return null;
+    dx /= dlen;
+    dy /= dlen;
+    dz /= dlen;
+
+    const right = camera.cameraRight;
+    const up = camera.cameraUp;
+
+    let closestHit: RaycastHit | null = null;
+    let closestDist = Infinity;
+
+    for (let _i = 0, _it = elements, _n = _it.length; _i < _n; _i++) { const el = _it[_i];
+      const cx = el.position[0];
+      const cy = el.position[1];
+      const cz = el.position[2];
+
+      // Billboard normal = cross(right, up) = camera forward
+      const normalX = right[1] * up[2] - right[2] * up[1];
+      const normalY = right[2] * up[0] - right[0] * up[2];
+      const normalZ = right[0] * up[1] - right[1] * up[0];
+      const nlen = Math.sqrt(normalX * normalX + normalY * normalY + normalZ * normalZ);
+      if (nlen === 0) continue;
+
+      // Ray-plane intersection: t = dot(center - origin, normal) / dot(dir, normal)
+      const ocx = cx - camera.cameraPosition[0];
+      const ocy = cy - camera.cameraPosition[1];
+      const ocz = cz - camera.cameraPosition[2];
+      const denom = dx * (normalX / nlen) + dy * (normalY / nlen) + dz * (normalZ / nlen);
+      if (Math.abs(denom) < 1e-6) continue;
+      const t = (ocx * (normalX / nlen) + ocy * (normalY / nlen) + ocz * (normalZ / nlen)) / denom;
+      if (t < 0) continue; // behind camera
+
+      // Intersection point
+      const px = camera.cameraPosition[0] + dx * t;
+      const py = camera.cameraPosition[1] + dy * t;
+      const pz = camera.cameraPosition[2] + dz * t;
+
+      // Convert to local UV on the billboard
+      const localX = (px - cx) * right[0] + (py - cy) * right[1] + (pz - cz) * right[2];
+      const localY = (px - cx) * up[0] + (py - cy) * up[1] + (pz - cz) * up[2];
+
+      const halfW = el.size[0] * 0.5;
+      const halfH = el.size[1] * 0.5;
+
+      if (Math.abs(localX) > halfW || Math.abs(localY) > halfH) continue;
+
+      const u = localX / el.size[0] + 0.5;
+      const v = localY / el.size[1] + 0.5;
+
+      if (t < closestDist) {
+        closestDist = t;
+        closestHit = { element: el, uv: [u, v] };
+      }
+    }
+
+    return closestHit;
+  }
+}
+
+interface RaycastHit {
+  element: WorldSpaceUIElement;
+  uv: [number, number];
+}

package/modules/native-osr/src/native-osr-manager.ts

@@ -0,0 +1,247 @@
+// ============================================================================
+// NativeOSRManager — Renderer-side coordinator for Blitz-backed OSR
+//
+// Coordinates panel renderers (createRenderer, addElement, render,
+// handleInput, focusBillboard, …). Textures come from in-process `pullFrame`
+// + writeTexture, and the host object is the native bridge's osr sub-API.
+// ============================================================================
+
+import { OSRInputRouter, type MouseState } from "./input-router";
+import { NativeOsrTextureSource, type NativeOsrFrameSource } from "./native-texture-source";
+import type {
+    AtlasLayout,
+    OSRHostBridge,
+    OSRPanelConfig,
+    OSRRendererConfig,
+    OSRRendererEvent,
+    OSRRendererStatus,
+    WorldSpaceUIElement,
+} from "./types";
+import { WorldSpaceUIPass, type CameraState } from "./world-space-ui-pass";
+
+
+
+/** The native bridge surface consumed by the manager — OSRHostBridge plus the
+ *  in-process frame-pull extension installed by NativeOsrHost. */
+export type NativeOsrHostBridge = OSRHostBridge & NativeOsrFrameSource & {
+  getDimensions?(rendererId: string): { width: number; height: number } | null;
+  hitTest?(rendererId: string, x: number, y: number): boolean;
+};
+
+export class NativeOSRManager {
+  private device: GPUDevice;
+  private host: NativeOsrHostBridge | null = null;
+  private sources = new Map<string, NativeOsrTextureSource>();
+  private renderPass: WorldSpaceUIPass;
+  private inputRouter: OSRInputRouter | null = null;
+  private elements = new Map<string, WorldSpaceUIElement>();
+  private rendererIds: string[] = [];
+  private rendererStatuses = new Map<string, OSRRendererStatus>();
+  private atlasLayouts = new Map<string, AtlasLayout>();
+  private errorTextureIndices = new Set<number>();
+  private cursorStyle: string = "default";
+  private onCursorStyleCb: ((cursor: string) => void) | null = null;
+
+  constructor(device: GPUDevice, surfaceFormat: GPUTextureFormat = "bgra8unorm", depthFormat: GPUTextureFormat = "depth24plus") {
+    this.device = device;
+    this.renderPass = new WorldSpaceUIPass(device, surfaceFormat, depthFormat);
+  }
+
+  init(host: NativeOsrHostBridge): void {
+    this.host = host;
+    this.renderPass.prepare();
+
+    host.onPanelLayout((rendererId, layout) => {
+      this.atlasLayouts.set(rendererId, layout);
+      this.updateInputRouterConfig();
+    });
+
+    host.onRendererEvent((event: OSRRendererEvent) => {
+      this.rendererStatuses.set(event.rendererId, event.status);
+      const texIdx = this.rendererIds.indexOf(event.rendererId);
+      if (texIdx >= 0) {
+        if (event.status === "failed") this.errorTextureIndices.add(texIdx);
+        else if (event.status === "running") this.errorTextureIndices.delete(texIdx);
+      }
+      this.updateInputRouterConfig();
+    });
+
+    if (typeof host.onCursorStyle === "function") {
+      host.onCursorStyle((_id, cursor) => {
+        if (this.cursorStyle !== cursor) {
+          this.cursorStyle = cursor;
+          this.onCursorStyleCb?.(cursor);
+        }
+      });
+    }
+  }
+
+  createRenderer(config: OSRRendererConfig): void {
+    if (!this.host) return;
+    this.sources.set(
+      config.id,
+      new NativeOsrTextureSource(this.device, config.id, config.width, config.height, config.pixelFormat ?? "rgba"),
+    );
+    this.rendererIds.push(config.id);
+    this.rendererStatuses.set(config.id, "running");
+    this.updateTextureBindings();
+    this.updateInputRouterConfig();
+    void this.host.createRenderer(config);
+  }
+
+  destroyRenderer(id: string): void {
+    if (!this.host) return;
+    const texIdx = this.rendererIds.indexOf(id);
+    this.sources.get(id)?.destroy();
+    this.sources.delete(id);
+    this.rendererIds = this.rendererIds.filter((r) => r !== id);
+    this.rendererStatuses.delete(id);
+    this.atlasLayouts.delete(id);
+    this.errorTextureIndices.delete(texIdx);
+    for (const [elId, el] of this.elements.entries()) {
+      if (el.textureIndex === texIdx) this.elements.delete(elId);
+    }
+    this.updateTextureBindings();
+    this.updateInputRouterConfig();
+    void this.host.destroyRenderer(id);
+  }
+
+  addPanel(config: OSRPanelConfig): void {
+    void this.host?.addPanel(config);
+  }
+
+  removePanel(rendererId: string, panelId: string): void {
+    void this.host?.removePanel(rendererId, panelId);
+  }
+
+  updatePanel(rendererId: string, panelId: string, html: string): void {
+    void this.host?.updatePanel(rendererId, panelId, html);
+  }
+
+  updateData(rendererId: string, panelId: string, values: Record<string, string | number | boolean>): void {
+    this.host?.updateData(rendererId, panelId, values);
+  }
+
+  setContent(rendererId: string, html: string): void {
+    void this.host?.setContent(rendererId, html);
+  }
+
+  addElement(element: WorldSpaceUIElement): void {
+    this.elements.set(element.id, element);
+  }
+
+  removeElement(id: string): void {
+    this.elements.delete(id);
+  }
+
+  updateElements(elements: WorldSpaceUIElement[]): void {
+    this.elements.clear();
+    elements.forEach((el) => { this.elements.set(el.id, el);; });
+  }
+
+  /** Pull dirty frames from the host and upload — call once per frame before
+   *  render(). Cheap when clean (the cdylib returns null without rasterizing). */
+  update(): void {
+    if (!this.host) return;
+    for (const source of this.sources.values()) {
+      source.update(this.host);
+    }
+  }
+
+  render(camera: CameraState, passEncoder: GPURenderPassEncoder): void {
+    if (this.elements.size === 0) return;
+    this.update();
+    const texList = this.getTextureList();
+    if (texList.length === 0) return;
+    this.renderPass.updateCamera(camera);
+    this.renderPass.setTextures(texList.map((t) => ({ textureView: t.textureView })));
+    this.renderPass.execute(passEncoder, Array.from(this.elements.values()), this.errorTextureIndices);
+  }
+
+  handleInput(camera: CameraState, mouseState: MouseState): void {
+    this.inputRouter?.handleMouse(camera, mouseState, Array.from(this.elements.values()));
+  }
+
+  handleKey(type: "keyDown" | "keyUp", keyCode: string, modifiers?: string[]): void {
+    this.inputRouter?.handleKey(type, keyCode, modifiers);
+  }
+
+  focusBillboard(canvasWidth?: number, canvasHeight?: number): string | null {
+    const id = this.inputRouter?.focusBillboard() ?? null;
+    if (id && canvasWidth && canvasHeight) {
+      this.inputRouter?.setForcedFocusCanvasSize(canvasWidth, canvasHeight);
+    }
+    return id;
+  }
+
+  unfocusBillboard(): void {
+    this.inputRouter?.unfocusBillboard();
+  }
+
+  isForcedFocus(): boolean {
+    return this.inputRouter?.isForcedFocus() ?? false;
+  }
+
+  isHoveringBillboard(): boolean {
+    return this.inputRouter?.isHoveringBillboard() ?? false;
+  }
+
+  getCursorStyle(): string {
+    return this.cursorStyle;
+  }
+
+  onCursorStyleChange(cb: ((cursor: string) => void) | null): void {
+    this.onCursorStyleCb = cb;
+  }
+
+  setSoftwareCursorEnabled(enabled: boolean): void {
+    if (!this.host || typeof this.host.setSoftwareCursor !== "function") return;
+    for (let _i7044 = 0, _it7044 = this.rendererIds, _n7044 = _it7044.length; _i7044 < _n7044; _i7044++) { const id = _it7044[_i7044]; this.host.setSoftwareCursor(id, enabled);; };
+  }
+
+  destroy(): void {
+    this.renderPass.destroy();
+    for (const s of this.sources.values()) s.destroy();
+    this.sources.clear();
+    this.elements.clear();
+    this.rendererIds = [];
+    this.rendererStatuses.clear();
+    this.atlasLayouts.clear();
+  }
+
+  private getTextureList(): { rendererId: string; textureView: GPUTextureView }[] {
+    const list: { rendererId: string; textureView: GPUTextureView }[] = [];
+    for (const [id, s] of this.sources.entries()) list.push({ rendererId: id, textureView: s.getTextureView() });
+    return list;
+  }
+
+  private updateTextureBindings(): void {
+    this.renderPass.setTextures(this.getTextureList().map((t) => ({ textureView: t.textureView })));
+  }
+
+  private updateInputRouterConfig(): void {
+    const textureIndexToRendererId = new Map<number, string>();
+    for (let i = 0; i < this.rendererIds.length; i++) textureIndexToRendererId.set(i, this.rendererIds[i]);
+
+    const rendererDimensions = new Map<string, { width: number; height: number }>();
+    this.rendererIds.forEach((id) => {
+      const s = this.sources.get(id);
+      if (s) rendererDimensions.set(id, { width: s.width, height: s.height });
+    });
+
+    const config = {
+      textureIndexToRendererId,
+      atlasLayouts: this.atlasLayouts,
+      rendererStatuses: this.rendererStatuses,
+      rendererDimensions,
+    };
+
+    if (!this.inputRouter && this.host) {
+      this.inputRouter = new OSRInputRouter(config, (rendererId, event) => {
+        this.host?.sendInputEvent(rendererId, event);
+      });
+    } else {
+      this.inputRouter?.updateConfig(config);
+    }
+  }
+}