@codexo/exojs 0.6.12 → 0.7.12

package/dist/esm/debug/DebugOverlay.js

@@ -0,0 +1,123 @@
+import { View } from '../rendering/View.js';
+import { Keyboard } from '../input/types.js';
+import { PerformanceLayer } from './PerformanceLayer.js';
+import { BoundingBoxesLayer } from './BoundingBoxesLayer.js';
+import { HitTestLayer } from './HitTestLayer.js';
+import { PointerStackLayer } from './PointerStackLayer.js';
+
+/**
+ * Canvas-native debug overlay. Instantiate AFTER Application is constructed:
+ *
+ *     import { DebugOverlay } from '@codexo/exojs/debug';
+ *     const debug = new DebugOverlay(app);
+ *     debug.layers.performance.visible = true;  // or press F1
+ *
+ * The overlay subscribes to `app.onFrame` and renders its visible layers.
+ * World-space layers render first (under text panels) in the scene view;
+ * screen-space layers then render in the overlay's pixel-space view.
+ *
+ * Keybindings (while canvas has focus):
+ *   F1 — toggle Performance layer
+ *   F2 — toggle BoundingBoxes layer
+ *   F3 — toggle HitTest layer
+ *   F4 — toggle PointerStack layer
+ *
+ * NOTE: F-keys only fire while the canvas has focus (engine convention).
+ *
+ * The master `visible` switch suppresses all layer rendering when false
+ * without changing individual layer visibility flags.
+ */
+class DebugOverlay {
+    /** Master visibility switch. When false, no layers render regardless of their individual flags. */
+    visible = true;
+    /** The four built-in diagnostic layers. Toggle each layer's `visible` flag or use the F1–F4 keybindings. */
+    layers;
+    _app;
+    _view;
+    _onFrameHandler;
+    _onKeyDownHandler;
+    _onResizeHandler;
+    constructor(app) {
+        this._app = app;
+        this._view = new View(app.canvas.width / 2, app.canvas.height / 2, app.canvas.width, app.canvas.height);
+        this.layers = {
+            performance: new PerformanceLayer(app),
+            boundingBoxes: new BoundingBoxesLayer(app),
+            hitTest: new HitTestLayer(app),
+            pointerStack: new PointerStackLayer(app),
+        };
+        this._onFrameHandler = this._onFrame.bind(this);
+        this._onKeyDownHandler = this._onKeyDown.bind(this);
+        this._onResizeHandler = this._onResize.bind(this);
+        app.onFrame.add(this._onFrameHandler);
+        app.inputManager.onKeyDown.add(this._onKeyDownHandler);
+        app.onResize.add(this._onResizeHandler);
+    }
+    /**
+     * Unsubscribe from all application events, destroy every layer, and
+     * release the overlay's internal {@link View}. Call this when you no
+     * longer need the overlay to avoid memory leaks.
+     */
+    destroy() {
+        this._app.onFrame.remove(this._onFrameHandler);
+        this._app.inputManager.onKeyDown.remove(this._onKeyDownHandler);
+        this._app.onResize.remove(this._onResizeHandler);
+        for (const layer of Object.values(this.layers)) {
+            layer.destroy();
+        }
+        this._view.destroy();
+    }
+    _onResize(width, height) {
+        this._view.resize(width, height);
+        this._view.setCenter(width / 2, height / 2);
+    }
+    _onFrame(delta) {
+        if (!this.visible)
+            return;
+        const layers = Object.values(this.layers);
+        const visibleLayers = layers.filter(l => l.visible);
+        if (visibleLayers.length === 0)
+            return;
+        const backend = this._app.backend;
+        const sceneView = backend.view; // capture scene's current view
+        // --- World-space layers first (render under screen-space text panels) ---
+        const worldLayers = visibleLayers.filter(l => l.viewMode === 'world');
+        for (const layer of worldLayers) {
+            layer.update(delta);
+            layer.render(backend);
+        }
+        // --- Screen-space layers: swap to overlay's pixel view ---
+        const screenLayers = visibleLayers.filter(l => l.viewMode === 'screen');
+        if (screenLayers.length > 0) {
+            backend.setView(this._view);
+            try {
+                for (const layer of screenLayers) {
+                    layer.update(delta);
+                    layer.render(backend);
+                }
+            }
+            finally {
+                backend.setView(sceneView);
+            }
+        }
+    }
+    _onKeyDown(channel) {
+        switch (channel) {
+            case Keyboard.F1:
+                this.layers.performance.visible = !this.layers.performance.visible;
+                break;
+            case Keyboard.F2:
+                this.layers.boundingBoxes.visible = !this.layers.boundingBoxes.visible;
+                break;
+            case Keyboard.F3:
+                this.layers.hitTest.visible = !this.layers.hitTest.visible;
+                break;
+            case Keyboard.F4:
+                this.layers.pointerStack.visible = !this.layers.pointerStack.visible;
+                break;
+        }
+    }
+}
+
+export { DebugOverlay };
+//# sourceMappingURL=DebugOverlay.js.map

package/dist/esm/debug/DebugOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DebugOverlay.js","sources":["../../../../src/debug/DebugOverlay.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/dist/esm/debug/HitTestLayer.d.ts

@@ -0,0 +1,32 @@
+import { DebugLayer } from './DebugLayer';
+import type { DebugLayerViewMode } from './DebugLayer';
+import type { Time } from '@/core/Time';
+import type { RenderBackend } from '@/rendering/RenderBackend';
+import type { Application } from '@/core/Application';
+/**
+ * Debug layer that draws outlines around interactive scene nodes.
+ * - Magenta: interactive but idle.
+ * - Yellow: currently hovered.
+ * - Cyan: pointer-captured (drag in progress).
+ * - Faint gray quadrant outlines when the spatial index is active (i.e.
+ *   at least one interactive node is present in the scene).
+ * World-space.
+ */
+export declare class HitTestLayer extends DebugLayer {
+    private _graphics;
+    constructor(app: Application);
+    /** Renders in world-space so outlines align with interactive node positions. */
+    get viewMode(): DebugLayerViewMode;
+    /** No per-frame pre-computation required; all state is derived in {@link render}. */
+    update(_delta: Time): void;
+    /**
+     * Walk the scene tree and draw color-coded outlines around interactive
+     * nodes (magenta = idle, yellow = hovered, cyan = pointer-captured).
+     * Also draws faint gray quadrant boundaries when the spatial index is
+     * active, helping diagnose partitioning behavior.
+     */
+    render(backend: RenderBackend): void;
+    /** Release the internal {@link Graphics} primitive. */
+    destroy(): void;
+    private _walkNode;
+}

package/dist/esm/debug/HitTestLayer.js

@@ -0,0 +1,118 @@
+import { DebugLayer } from './DebugLayer.js';
+import { Graphics } from '../rendering/primitives/Graphics.js';
+import { Color } from '../core/Color.js';
+import '../math/Size.js';
+import '../core/Time.js';
+import '../core/SceneNode.js';
+import '../math/Rectangle.js';
+import '../rendering/types.js';
+import '../rendering/View.js';
+import '../rendering/texture/RenderTexture.js';
+
+// Color constants (created once, reused).
+const colorIdle = new Color(1, 0, 1, 0.6); // magenta
+const colorHovered = new Color(1, 1, 0, 0.9); // yellow
+const colorCaptured = new Color(0, 1, 1, 0.9); // cyan
+const colorQuadrant = new Color(0.5, 0.5, 0.5, 0.3); // faint gray
+/**
+ * Debug layer that draws outlines around interactive scene nodes.
+ * - Magenta: interactive but idle.
+ * - Yellow: currently hovered.
+ * - Cyan: pointer-captured (drag in progress).
+ * - Faint gray quadrant outlines when the spatial index is active (i.e.
+ *   at least one interactive node is present in the scene).
+ * World-space.
+ */
+class HitTestLayer extends DebugLayer {
+    _graphics = null;
+    constructor(app) {
+        super(app);
+    }
+    /** Renders in world-space so outlines align with interactive node positions. */
+    get viewMode() {
+        return 'world';
+    }
+    /** No per-frame pre-computation required; all state is derived in {@link render}. */
+    update(_delta) {
+        // Nothing to pre-compute; all state is read in render().
+    }
+    /**
+     * Walk the scene tree and draw color-coded outlines around interactive
+     * nodes (magenta = idle, yellow = hovered, cyan = pointer-captured).
+     * Also draws faint gray quadrant boundaries when the spatial index is
+     * active, helping diagnose partitioning behavior.
+     */
+    render(backend) {
+        const root = this._app.sceneManager.scene?.root;
+        if (!root) {
+            return;
+        }
+        if (this._graphics === null) {
+            this._graphics = new Graphics();
+        }
+        const gfx = this._graphics;
+        gfx.clear();
+        gfx.lineWidth = 1;
+        // Determine hovered and captured sets for color-coding.
+        const interaction = this._app.interaction;
+        const hoveredNode = interaction.getHoveredNode();
+        const capturedNodes = new Set(interaction.getCapturedNodes());
+        // Walk scene and draw outlines for interactive nodes.
+        this._walkNode(root, gfx, hoveredNode, capturedNodes);
+        // Draw quadtree regions when the spatial index is active.
+        const quadtree = interaction._getDebugQuadtree();
+        if (quadtree !== null) {
+            gfx.lineColor = colorQuadrant;
+            quadtree._walkBounds((rect) => {
+                gfx.moveTo(rect.left, rect.top);
+                gfx.lineTo(rect.right, rect.top);
+                gfx.lineTo(rect.right, rect.bottom);
+                gfx.lineTo(rect.left, rect.bottom);
+                gfx.lineTo(rect.left, rect.top);
+            });
+        }
+        gfx.render(backend);
+    }
+    /** Release the internal {@link Graphics} primitive. */
+    destroy() {
+        if (this._graphics !== null) {
+            this._graphics.destroy();
+            this._graphics = null;
+        }
+    }
+    // -----------------------------------------------------------------------
+    _walkNode(node, gfx, hovered, captured) {
+        if (!node.visible) {
+            return;
+        }
+        if (node.interactive) {
+            const bounds = node.getBounds();
+            if (bounds.width > 0 && bounds.height > 0) {
+                if (captured.has(node)) {
+                    gfx.lineColor = colorCaptured;
+                }
+                else if (node === hovered) {
+                    gfx.lineColor = colorHovered;
+                }
+                else {
+                    gfx.lineColor = colorIdle;
+                }
+                gfx.moveTo(bounds.left, bounds.top);
+                gfx.lineTo(bounds.right, bounds.top);
+                gfx.lineTo(bounds.right, bounds.bottom);
+                gfx.lineTo(bounds.left, bounds.bottom);
+                gfx.lineTo(bounds.left, bounds.top);
+            }
+        }
+        // Recurse into Container children.
+        const container = node;
+        if (Array.isArray(container.children)) {
+            for (const child of container.children) {
+                this._walkNode(child, gfx, hovered, captured);
+            }
+        }
+    }
+}
+
+export { HitTestLayer };
+//# sourceMappingURL=HitTestLayer.js.map

package/dist/esm/debug/HitTestLayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HitTestLayer.js","sources":["../../../../src/debug/HitTestLayer.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;AAUA;AACA,MAAM,SAAS,GAAO,IAAI,KAAK,CAAC,CAAC,EAAK,CAAC,EAAK,CAAC,EAAK,GAAG,CAAC,CAAC;AACvD,MAAM,YAAY,GAAI,IAAI,KAAK,CAAC,CAAC,EAAK,CAAC,EAAK,CAAC,EAAK,GAAG,CAAC,CAAC;AACvD,MAAM,aAAa,GAAG,IAAI,KAAK,CAAC,CAAC,EAAK,CAAC,EAAK,CAAC,EAAK,GAAG,CAAC,CAAC;AACvD,MAAM,aAAa,GAAG,IAAI,KAAK,CAAC,GAAG,EAAG,GAAG,EAAG,GAAG,EAAG,GAAG,CAAC,CAAC;AAEvD;;;;;;;;AAQG;AACG,MAAO,YAAa,SAAQ,UAAU,CAAA;IAChC,SAAS,GAAoB,IAAI;AAEzC,IAAA,WAAA,CAAmB,GAAgB,EAAA;QAC/B,KAAK,CAAC,GAAG,CAAC;IACd;;AAGA,IAAA,IAAoB,QAAQ,GAAA;AACxB,QAAA,OAAO,OAAO;IAClB;;AAGgB,IAAA,MAAM,CAAC,MAAY,EAAA;;IAEnC;AAEA;;;;;AAKG;AACa,IAAA,MAAM,CAAC,OAAsB,EAAA;QACzC,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI;QAE/C,IAAI,CAAC,IAAI,EAAE;YACP;QACJ;AAEA,QAAA,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,EAAE;AACzB,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI,QAAQ,EAAE;QACnC;AAEA,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS;QAE1B,GAAG,CAAC,KAAK,EAAE;AACX,QAAA,GAAG,CAAC,SAAS,GAAG,CAAC;;AAGjB,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,WAAW;AACzC,QAAA,MAAM,WAAW,GAAG,WAAW,CAAC,cAAc,EAAE;QAChD,MAAM,aAAa,GAAG,IAAI,GAAG,CAAC,WAAW,CAAC,gBAAgB,EAAE,CAAC;;QAG7D,IAAI,CAAC,SAAS,CAAC,IAAkB,EAAE,GAAG,EAAE,WAAW,EAAE,aAAa,CAAC;;AAGnE,QAAA,MAAM,QAAQ,GAAG,WAAW,CAAC,iBAAiB,EAAE;AAEhD,QAAA,IAAI,QAAQ,KAAK,IAAI,EAAE;AACnB,YAAA,GAAG,CAAC,SAAS,GAAG,aAAa;AAE7B,YAAA,QAAQ,CAAC,WAAW,CAAC,CAAC,IAAI,KAAI;gBAC1B,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAG,IAAI,CAAC,GAAG,CAAC;gBAChC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC;gBAChC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC;gBACnC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAG,IAAI,CAAC,MAAM,CAAC;gBACnC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAG,IAAI,CAAC,GAAG,CAAC;AACpC,YAAA,CAAC,CAAC;QACN;AAEA,QAAA,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC;IACvB;;IAGgB,OAAO,GAAA;AACnB,QAAA,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,EAAE;AACzB,YAAA,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE;AACxB,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI;QACzB;IACJ;;AAIQ,IAAA,SAAS,CACb,IAAgB,EAChB,GAAa,EACb,OAA0B,EAC1B,QAAyB,EAAA;AAEzB,QAAA,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;YACf;QACJ;AAEA,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE;AAClB,YAAA,MAAM,MAAM,GAAG,IAAI,CAAC,SAAS,EAAE;AAE/B,YAAA,IAAI,MAAM,CAAC,KAAK,GAAG,CAAC,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE;AACvC,gBAAA,IAAI,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;AACpB,oBAAA,GAAG,CAAC,SAAS,GAAG,aAAa;gBACjC;AAAO,qBAAA,IAAI,IAAI,KAAK,OAAO,EAAE;AACzB,oBAAA,GAAG,CAAC,SAAS,GAAG,YAAY;gBAChC;qBAAO;AACH,oBAAA,GAAG,CAAC,SAAS,GAAG,SAAS;gBAC7B;gBAEA,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,EAAG,MAAM,CAAC,GAAG,CAAC;gBACpC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,CAAC;gBACpC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC;gBACvC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,EAAG,MAAM,CAAC,MAAM,CAAC;gBACvC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,EAAG,MAAM,CAAC,GAAG,CAAC;YACxC;QACJ;;QAGA,MAAM,SAAS,GAAG,IAAgD;QAElE,IAAI,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,EAAE;AACnC,YAAA,KAAK,MAAM,KAAK,IAAI,SAAS,CAAC,QAAQ,EAAE;gBACpC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,GAAG,EAAE,OAAO,EAAE,QAAQ,CAAC;YACjD;QACJ;IACJ;AACH;;;;"}

package/dist/esm/debug/PerformanceLayer.d.ts

@@ -0,0 +1,37 @@
+import { DebugLayer, type DebugLayerViewMode } from './DebugLayer';
+import type { Time } from '@/core/Time';
+import type { RenderBackend } from '@/rendering/RenderBackend';
+import type { Application } from '@/core/Application';
+/**
+ * Debug layer that renders a compact screen-space HUD (top-left) showing
+ * rolling-average FPS, per-frame time in milliseconds, draw-call count, and
+ * scene-node count, alongside a 120-sample frame-time sparkline.
+ *
+ * Enable via {@link DebugOverlay} or by pressing F1 while the canvas has focus.
+ */
+export declare class PerformanceLayer extends DebugLayer {
+    private readonly _fpsSamples;
+    private _fpsSampleIndex;
+    private readonly _sparkSamples;
+    private _sparkSampleIndex;
+    private _root;
+    private _textFps;
+    private _textFrame;
+    private _textDraws;
+    private _textNodes;
+    private _sparkline;
+    constructor(app: Application);
+    get viewMode(): DebugLayerViewMode;
+    /**
+     * Sample the current frame time, recompute the rolling FPS average,
+     * update stat text nodes, and rebuild the sparkline geometry. Lazily
+     * initializes the panel scene graph on first call to avoid touching the
+     * glyph atlas until the layer is actually shown.
+     */
+    update(delta: Time): void;
+    /** Submit the panel's {@link Container} subtree to the backend for drawing. */
+    render(backend: RenderBackend): void;
+    /** Destroy the panel's {@link Container} subtree and release all child references. */
+    destroy(): void;
+    private _build;
+}

package/dist/esm/debug/PerformanceLayer.js

@@ -0,0 +1,193 @@
+import { DebugLayer } from './DebugLayer.js';
+import { Graphics } from '../rendering/primitives/Graphics.js';
+import { Text } from '../rendering/text/Text.js';
+import { TextStyle } from '../rendering/text/TextStyle.js';
+import { Color } from '../core/Color.js';
+import { Container } from '../rendering/Container.js';
+
+// --- layout constants (camelCase to satisfy lint naming convention) ----------
+const panelX = 8;
+const panelY = 8;
+const panelW = 180;
+const panelH = 130;
+const lineH = 14;
+const textSize = 11;
+const textRowCount = 4;
+const sparklineY = panelY + 8 + textRowCount * lineH + 4;
+const sparklineH = panelH - (sparklineY - panelY) - 4;
+const sparklineW = panelW - 16;
+const sparklineX = panelX + 8;
+const fpsSampleCount = 60;
+const sparklineSampleCount = 120;
+const sparklineMaxMs = 33; // 100% height = 33ms (~30 fps)
+// Semi-transparent dark background.
+const bgColor = new Color(0, 0, 0, 0.7);
+// Bright text color (light blue-white).
+const textColor = Color.white.clone();
+// Cyan sparkline.
+const sparklineColor = new Color(0, 1, 1, 1.0);
+// -----------------------------------------------------------------------------
+/** Recursively count nodes under a RenderNode. */
+function countNodes(node) {
+    let count = 1;
+    const container = node;
+    if (Array.isArray(container.children)) {
+        for (const child of container.children) {
+            count += countNodes(child);
+        }
+    }
+    return count;
+}
+/**
+ * Debug layer that renders a compact screen-space HUD (top-left) showing
+ * rolling-average FPS, per-frame time in milliseconds, draw-call count, and
+ * scene-node count, alongside a 120-sample frame-time sparkline.
+ *
+ * Enable via {@link DebugOverlay} or by pressing F1 while the canvas has focus.
+ */
+class PerformanceLayer extends DebugLayer {
+    // Rolling FPS sample buffer (60 samples).
+    _fpsSamples = new Float32Array(fpsSampleCount);
+    _fpsSampleIndex = 0;
+    // Rolling frame-time buffer (120 samples) for sparkline.
+    _sparkSamples = new Float32Array(sparklineSampleCount);
+    _sparkSampleIndex = 0;
+    // Root container — lazily initialized on first update() call so the
+    // glyph atlas is not touched in environments where canvas 2D is absent.
+    _root = null;
+    _textFps = null;
+    _textFrame = null;
+    _textDraws = null;
+    _textNodes = null;
+    _sparkline = null;
+    constructor(app) {
+        super(app);
+    }
+    get viewMode() {
+        return 'screen';
+    }
+    /**
+     * Sample the current frame time, recompute the rolling FPS average,
+     * update stat text nodes, and rebuild the sparkline geometry. Lazily
+     * initializes the panel scene graph on first call to avoid touching the
+     * glyph atlas until the layer is actually shown.
+     */
+    update(delta) {
+        // Lazily build the scene graph on first update so that Text (which
+        // touches the glyph atlas immediately) is only constructed when the
+        // layer is first made visible — not at DebugOverlay construction time.
+        if (this._root === null) {
+            this._build();
+        }
+        // --- FPS rolling average ---
+        const frameMs = delta.milliseconds;
+        this._fpsSamples[this._fpsSampleIndex] = frameMs;
+        this._fpsSampleIndex = (this._fpsSampleIndex + 1) % fpsSampleCount;
+        let totalMs = 0;
+        let validSamples = 0;
+        for (let i = 0; i < fpsSampleCount; i++) {
+            const s = this._fpsSamples[i];
+            if (s > 0) {
+                totalMs += s;
+                validSamples++;
+            }
+        }
+        const avgMs = validSamples > 0 ? totalMs / validSamples : 0;
+        const fps = avgMs > 0 ? 1000 / avgMs : 0;
+        // --- Sparkline sample ---
+        this._sparkSamples[this._sparkSampleIndex] = frameMs;
+        this._sparkSampleIndex = (this._sparkSampleIndex + 1) % sparklineSampleCount;
+        // --- Stats ---
+        const stats = this._app.backend.stats;
+        const scene = this._app.sceneManager.scene;
+        const nodeCount = scene ? countNodes(scene.root) : 0;
+        // --- Update text ---
+        if (this._textFps !== null) {
+            this._textFps.text = `FPS: ${fps.toFixed(1)}`;
+        }
+        if (this._textFrame !== null) {
+            this._textFrame.text = `Frame: ${frameMs.toFixed(1)}ms`;
+        }
+        if (this._textDraws !== null) {
+            this._textDraws.text = `Draws: ${stats.drawCalls}`;
+        }
+        if (this._textNodes !== null) {
+            this._textNodes.text = `Nodes: ${nodeCount}`;
+        }
+        // --- Rebuild sparkline geometry ---
+        if (this._sparkline !== null) {
+            this._sparkline.clear();
+            this._sparkline.lineWidth = 1;
+            this._sparkline.lineColor = sparklineColor;
+            // Walk samples in chronological order (oldest first).
+            const oldest = this._sparkSampleIndex;
+            const stepX = sparklineW / (sparklineSampleCount - 1);
+            let started = false;
+            for (let i = 0; i < sparklineSampleCount; i++) {
+                const idx = (oldest + i) % sparklineSampleCount;
+                const ms = this._sparkSamples[idx];
+                const px = sparklineX + i * stepX;
+                const py = sparklineY + sparklineH - Math.min(1, ms / sparklineMaxMs) * sparklineH;
+                if (!started) {
+                    this._sparkline.moveTo(px, py);
+                    started = true;
+                }
+                else {
+                    this._sparkline.lineTo(px, py);
+                }
+            }
+        }
+    }
+    /** Submit the panel's {@link Container} subtree to the backend for drawing. */
+    render(backend) {
+        this._root?.render(backend);
+    }
+    /** Destroy the panel's {@link Container} subtree and release all child references. */
+    destroy() {
+        if (this._root !== null) {
+            this._root.destroy();
+            this._root = null;
+        }
+        this._textFps = null;
+        this._textFrame = null;
+        this._textDraws = null;
+        this._textNodes = null;
+        this._sparkline = null;
+    }
+    // -----------------------------------------------------------------------
+    _build() {
+        const style = new TextStyle({
+            fontSize: textSize,
+            fontFamily: 'Arial',
+            fontWeight: 'normal',
+            fillColor: textColor,
+            strokeThickness: 0,
+        });
+        const bg = new Graphics();
+        bg.fillColor = bgColor;
+        bg.drawRectangle(panelX, panelY, panelW, panelH);
+        this._textFps = new Text('FPS: -', style.clone());
+        this._textFrame = new Text('Frame: -', style.clone());
+        this._textDraws = new Text('Draws: -', style.clone());
+        this._textNodes = new Text('Nodes: -', style.clone());
+        this._textFps.x = panelX + 8;
+        this._textFps.y = panelY + 8;
+        this._textFrame.x = panelX + 8;
+        this._textFrame.y = panelY + 8 + lineH;
+        this._textDraws.x = panelX + 8;
+        this._textDraws.y = panelY + 8 + lineH * 2;
+        this._textNodes.x = panelX + 8;
+        this._textNodes.y = panelY + 8 + lineH * 3;
+        this._sparkline = new Graphics();
+        this._root = new Container();
+        this._root.addChild(bg);
+        this._root.addChild(this._textFps);
+        this._root.addChild(this._textFrame);
+        this._root.addChild(this._textDraws);
+        this._root.addChild(this._textNodes);
+        this._root.addChild(this._sparkline);
+    }
+}
+
+export { PerformanceLayer };
+//# sourceMappingURL=PerformanceLayer.js.map

package/dist/esm/debug/PerformanceLayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PerformanceLayer.js","sources":["../../../../src/debug/PerformanceLayer.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/dist/esm/debug/PointerStackLayer.d.ts

@@ -0,0 +1,31 @@
+import { DebugLayer } from './DebugLayer';
+import type { DebugLayerViewMode } from './DebugLayer';
+import type { Time } from '@/core/Time';
+import type { RenderBackend } from '@/rendering/RenderBackend';
+import type { Application } from '@/core/Application';
+/**
+ * Debug layer that shows a screen-space panel (top-right corner) listing all
+ * RenderNodes under the current pointer position, sorted by zIndex descending.
+ * Screen-space.
+ */
+export declare class PointerStackLayer extends DebugLayer {
+    private _root;
+    private _bg;
+    private _lines;
+    constructor(app: Application);
+    /** Renders in screen-space so the panel stays fixed in the top-right corner. */
+    get viewMode(): DebugLayerViewMode;
+    /**
+     * Lazily initialize the panel on first call, reposition it to the
+     * top-right corner, and populate text lines with the current pointer
+     * stack (up to 10 entries, sorted by zIndex descending).
+     */
+    update(_delta: Time): void;
+    /** Submit the panel's {@link Container} subtree to the backend for drawing. */
+    render(backend: RenderBackend): void;
+    /** Destroy the panel's {@link Container} subtree and release all child references. */
+    destroy(): void;
+    private _build;
+    private _buildLines;
+    private _collectContaining;
+}