@downdraft/engine 0.2.0 → 0.3.1

package/dist/libraries/physics-rapier/src/api.js

@@ -235,6 +235,21 @@ export class UniversalPhysicsAPI {
     setIntegrationDt(realmId, dt) {
         this.backend.setIntegrationDt(realmId, dt);
     }
+    /**
+     * Change gravity across all realms (applies to near/mid/far). Best-effort:
+     * backends that can't mutate realm gravity omit `setRealmGravity`, in which
+     * case callers should fall back to per-body `gravityScale` in BodyDesc.
+     */
+    setGravity(gravity) {
+        [RealmTier.Near, RealmTier.Mid, RealmTier.Far].forEach((tier) => {
+            try {
+                const realm = this.realmManager.getRealm(tier);
+                this.backend.setRealmGravity?.(realm.id, gravity);
+            }
+            catch { /* realm tier not initialized */ }
+        });
+        this.config.gravity = gravity;
+    }
     // --- Realm ---
     getRealmTier(body) {
         return this.realmManager.getRealmForBody(body);

package/dist/libraries/physics-rapier/src/backend.js

@@ -442,6 +442,21 @@ export class RapierPhysicsBackend {
             this.lib.setIntegrationDt(realmId, dt);
         }
     }
+    /**
+     * Change a live realm's gravity. Updates the stored realm config (the
+     * no-lib JS fallback stepper reads it) and forwards to the lib when it
+     * supports runtime gravity (the WASM Rapier world.gravity is mutable; the
+     * native FFI lib may not implement it — callers should treat this as
+     * best-effort).
+     */
+    setRealmGravity(realmId, gravity) {
+        const realm = this.realms.get(realmId);
+        if (realm)
+            realm.config.gravity = gravity;
+        if (this.lib && this.lib.setRealmGravity) {
+            this.lib.setRealmGravity(realmId, gravity);
+        }
+    }
     setSleepThresholds(realmId, linearThreshold, angularThreshold) {
         if (this.lib) {
             this.lib.setSleepThresholds(realmId, linearThreshold, angularThreshold);

package/dist/libraries/physics-rapier/src/rapier-backend.js

@@ -154,6 +154,11 @@ async function doLoadPhysicsLib() {
                 entityByBodyHandle.delete(id);
                 bodyIdByHandle.delete(id);
             },
+            setRealmGravity(id, gravity) {
+                const world = realms.get(id);
+                if (world)
+                    world.gravity = { x: gravity[0], y: gravity[1], z: gravity[2] };
+            },
             createBody(realmId, bodyId, desc, entity) {
                 const world = realms.get(realmId);
                 if (!world)

package/dist/libraries/postfx/src/post-process-stack.js

@@ -443,9 +443,7 @@ export class PostProcessStack {
     createGlyphAtlas() {
         const chars = " .:-=+*#%@";
         const gw = 16, gh = 16, cols = chars.length;
-        const canvas = document.createElement("canvas");
-        canvas.width = cols * gw;
-        canvas.height = gh;
+        const canvas = new OffscreenCanvas(cols * gw, gh);
         const ctx = canvas.getContext("2d");
         ctx.fillStyle = "black";
         ctx.fillRect(0, 0, canvas.width, canvas.height);

package/dist/libraries/sand/src/materials.js

@@ -72,32 +72,18 @@ export var Material;
     // --- Ingredients ---
     // Ice (frozen water — produced by cooling)
     Material[Material["Ice"] = 64] = "Ice";
+    // (IDs 67–68, 71–73, 76–77, 79–81, 83–88 were inert alchemy materials —
+    // retired; keep the gaps so old saves don't remap onto new materials.)
     // Liquids
     Material[Material["Ether"] = 65] = "Ether";
     Material[Material["Blood"] = 66] = "Blood";
-    Material[Material["Syrup"] = 67] = "Syrup";
-    Material[Material["NightshadeExtract"] = 68] = "NightshadeExtract";
     Material[Material["TrollBlood"] = 69] = "TrollBlood";
     Material[Material["LiquidShadow"] = 70] = "LiquidShadow";
-    Material[Material["LoveEssence"] = 71] = "LoveEssence";
-    Material[Material["HateEssence"] = 72] = "HateEssence";
-    Material[Material["DreamMist"] = 73] = "DreamMist";
     Material[Material["VoidEssence"] = 74] = "VoidEssence";
     // Powders (solid, fall)
     Material[Material["Sulfur"] = 75] = "Sulfur";
-    Material[Material["GroundEyeOfNewt"] = 76] = "GroundEyeOfNewt";
-    Material[Material["GroundBatWing"] = 77] = "GroundBatWing";
     Material[Material["BoneDust"] = 78] = "BoneDust";
-    Material[Material["IronFilings"] = 79] = "IronFilings";
-    Material[Material["MoonstoneDust"] = 80] = "MoonstoneDust";
-    Material[Material["CrystalDust"] = 81] = "CrystalDust";
     Material[Material["MushroomSpores"] = 82] = "MushroomSpores";
-    Material[Material["DragonScale"] = 83] = "DragonScale";
-    Material[Material["PhoenixFeather"] = 84] = "PhoenixFeather";
-    Material[Material["UnicornHorn"] = 85] = "UnicornHorn";
-    Material[Material["MandrakeRoot"] = 86] = "MandrakeRoot";
-    Material[Material["SpiderSilk"] = 87] = "SpiderSilk";
-    Material[Material["GraveDust"] = 88] = "GraveDust";
     Material[Material["StarShard"] = 89] = "StarShard";
     Material[Material["TimeSand"] = 90] = "TimeSand";
     // Gases
@@ -232,29 +218,13 @@ export const MATERIALS = {
     // --- Liquids ---
     [Material.Ether]: def(65, "Ether", [0.55, 0.45, 0.85, 0.8], { gravity: 1.5, gravityDir: 1, density: 0.7, liquid: true, flammable: true, burnTime: 40, albedo: 0.2, reflectivity: 0.4, brightness: 1.1 }),
     [Material.Blood]: def(66, "Blood", [0.7, 0.05, 0.05, 0.95], { gravity: 2, gravityDir: 1, density: 1.06, liquid: true, albedo: 0.3, reflectivity: 0.2, brightness: 0.8 }),
-    [Material.Syrup]: def(67, "Syrup", [0.6, 0.4, 0.15, 0.95], { gravity: 1, gravityDir: 1, density: 1.4, liquid: true, albedo: 0.3, reflectivity: 0.3, brightness: 0.9 }),
-    [Material.NightshadeExtract]: def(68, "Nightshade Extract", [0.3, 0.05, 0.35, 0.95], { gravity: 2, gravityDir: 1, density: 1.1, liquid: true, albedo: 0.2, reflectivity: 0.1, brightness: 0.7 }),
     [Material.TrollBlood]: def(69, "Troll Blood", [0.4, 0.2, 0.15, 0.95], { gravity: 2, gravityDir: 1, density: 1.2, liquid: true, albedo: 0.25, reflectivity: 0.15, brightness: 0.8 }),
     [Material.LiquidShadow]: def(70, "Liquid Shadow", [0.05, 0.05, 0.12, 0.98], { gravity: 3, gravityDir: 1, density: 2.0, liquid: true, albedo: 0.0, reflectivity: 0.0, brightness: 0.3 }),
-    [Material.LoveEssence]: def(71, "Love Essence", [0.95, 0.4, 0.6, 0.9], { gravity: 1.5, gravityDir: 1, density: 0.9, liquid: true, albedo: 0.3, reflectivity: 0.4, brightness: 1.0 }),
-    [Material.HateEssence]: def(72, "Hate Essence", [0.2, 0.1, 0.15, 0.9], { gravity: 2, gravityDir: 1, density: 1.3, liquid: true, albedo: 0.2, reflectivity: 0.2, brightness: 0.7 }),
-    [Material.DreamMist]: def(73, "Dream Mist", [0.6, 0.7, 0.95, 0.6], { gravity: 1, gravityDir: -1, density: 0.3, liquid: true, albedo: 0.2, reflectivity: 0.5, brightness: 1.2 }),
     [Material.VoidEssence]: def(74, "Void Essence", [0.1, 0.0, 0.2, 0.95], { gravity: 4, gravityDir: 1, density: 3.0, liquid: true, albedo: 0.0, reflectivity: 0.1, brightness: 0.5 }),
     // --- Alchemy game: powders (solid, fall) ---
     [Material.Sulfur]: def(75, "Sulfur", [0.9, 0.85, 0.2, 1.0], { gravity: 1, gravityDir: 1, density: 2.0, solid: true, flammable: true, burnTime: 60, albedo: 0.5, reflectivity: 0.1, brightness: 0.9 }),
-    [Material.GroundEyeOfNewt]: def(76, "Ground Eye of Newt", [0.5, 0.35, 0.2, 1.0], { gravity: 1, gravityDir: 1, density: 1.2, solid: true, albedo: 0.4, brightness: 0.8 }),
-    [Material.GroundBatWing]: def(77, "Ground Bat Wing", [0.3, 0.25, 0.35, 1.0], { gravity: 0.8, gravityDir: 1, density: 0.6, solid: true, albedo: 0.3, brightness: 0.7 }),
     [Material.BoneDust]: def(78, "Bone Dust", [0.85, 0.82, 0.75, 1.0], { gravity: 1, gravityDir: 1, density: 1.5, solid: true, albedo: 0.5, brightness: 0.8 }),
-    [Material.IronFilings]: def(79, "Iron Filings", [0.55, 0.55, 0.6, 1.0], { gravity: 1.5, gravityDir: 1, density: 7.8, solid: true, magnetic: true, albedo: 0.5, reflectivity: 0.3 }),
-    [Material.MoonstoneDust]: def(80, "Moonstone Dust", [0.8, 0.85, 0.95, 1.0], { gravity: 1, gravityDir: 1, density: 1.0, solid: true, albedo: 0.4, reflectivity: 0.5, brightness: 1.3 }),
-    [Material.CrystalDust]: def(81, "Crystal Dust", [0.6, 0.9, 0.95, 1.0], { gravity: 1, gravityDir: 1, density: 2.5, solid: true, albedo: 0.3, reflectivity: 0.6, brightness: 1.2 }),
     [Material.MushroomSpores]: def(82, "Mushroom Spores", [0.6, 0.5, 0.4, 0.9], { gravity: 0.5, gravityDir: 1, density: 0.4, solid: true, albedo: 0.3, brightness: 0.8 }),
-    [Material.DragonScale]: def(83, "Dragon Scale", [0.5, 0.15, 0.1, 1.0], { gravity: 1.5, gravityDir: 1, density: 5.0, solid: true, albedo: 0.4, reflectivity: 0.3, brightness: 1.0 }),
-    [Material.PhoenixFeather]: def(84, "Phoenix Feather", [0.95, 0.5, 0.15, 0.9], { gravity: 0.3, gravityDir: 1, density: 0.3, solid: true, flammable: true, burnTime: 200, albedo: 0.4, brightness: 1.4 }),
-    [Material.UnicornHorn]: def(85, "Unicorn Horn", [0.95, 0.9, 1.0, 1.0], { gravity: 1, gravityDir: 1, density: 1.8, solid: true, albedo: 0.5, reflectivity: 0.5, brightness: 1.5 }),
-    [Material.MandrakeRoot]: def(86, "Mandrake Root", [0.5, 0.4, 0.25, 1.0], { gravity: 1, gravityDir: 1, density: 1.3, solid: true, albedo: 0.4, brightness: 0.7 }),
-    [Material.SpiderSilk]: def(87, "Spider Silk", [0.9, 0.9, 0.85, 0.8], { gravity: 0.2, gravityDir: 1, density: 0.2, solid: true, albedo: 0.4, reflectivity: 0.2, brightness: 0.9 }),
-    [Material.GraveDust]: def(88, "Grave Dust", [0.3, 0.28, 0.25, 1.0], { gravity: 1, gravityDir: 1, density: 1.8, solid: true, albedo: 0.3, brightness: 0.6 }),
     [Material.StarShard]: def(89, "Star Shard", [0.7, 0.8, 1.0, 1.0], { gravity: 1, gravityDir: 1, density: 2.0, solid: true, albedo: 0.3, reflectivity: 0.7, brightness: 1.6 }),
     [Material.TimeSand]: def(90, "Time Sand", [0.4, 0.3, 0.6, 0.9], { gravity: 1, gravityDir: 1, density: 1.5, solid: true, albedo: 0.3, reflectivity: 0.4, brightness: 1.2 }),
     // --- Alchemy game: gases + byproducts ---

package/dist/libraries/sand/src/sand-world.js

@@ -2207,9 +2207,6 @@ export class SandWorld {
                     continue;
                 }
             }
-            // --- PhoenixFeather near fire/lava: glows brighter, resists burning ---
-            // (flammable but long burnTime already set; here we just let it shimmer)
-            // --- DragonScale: very dense, sinks through liquids (handled by density) ---
             // --- LiquidShadow + light source (fire/plasma) → dissipates to smoke ---
             if (mat === Material.LiquidShadow) {
                 let lightNi = -1;

package/dist/modules/devtools/src/api.js

@@ -3,16 +3,15 @@
 // engine systems, regardless of which thread they run on.
 //
 // Realm detection determines transport:
-//   - Main realm: panels/feeds/commands registered directly on
+//   - Main realm: feeds/commands registered directly on
 //     window.__sceneInspector via DevToolsDataBridge.
-//   - Worker realm: panels/feeds/commands registered in a worker-side
-//     registry. Data feeds are written to a devtools SAB region (zero-copy,
-//     synchronous reads). Commands are forwarded via worker RPC. Panel
-//     declarations are synced to the renderer via a one-time manifest RPC.
+//   - Worker realm: feeds/commands registered in a worker-side registry.
+//     Data feeds are written to a devtools SAB region (zero-copy,
+//     synchronous reads). Commands are forwarded via worker RPC.
 //
 // Plugins import `devtools` from @downdraft/engine/modules/devtools and call
-// registerPanel/registerDataFeed/registerCommand/registerSABStat — the same
-// API works in both realms.
+// registerDataFeed/registerCommand/registerSABStat — the same API works in
+// both realms.
 // ============================================================================
 import { resourceToken } from "@downdraft/engine/ecs/resource";
 import { createLogger } from "@downdraft/engine/util/logger";
@@ -50,7 +49,7 @@ export const DEVTOOLS_REALM = detectRealm();
 // synchronously. No RPC polling needed.
 //
 // Layout:
-//   [0..3]   manifestVersion: Uint32  (bumped when panels/feeds change)
+//   [0..3]   manifestVersion: Uint32  (bumped when feeds/commands change)
 //   [4..7]   feedCount: Uint32
 //   [8..]    feed entries: each is [lengthBytes: Uint32][JSON bytes...]
 //            (lengthBytes = 0 means "not yet written" / "unavailable")
@@ -81,8 +80,6 @@ export function allocateDevToolsSAB(maxFeedBlobBytes, statsBytes) {
 }
 class DevToolsAPIImpl {
     realm;
-    panels = new Map();
-    toggles = new Map();
     dataFeeds = new Map();
     dataFeedNames = []; // ordered list for feedIndex assignment
     commands = new Map();
@@ -99,14 +96,6 @@ class DevToolsAPIImpl {
     constructor(realm) {
         this.realm = realm;
     }
-    registerPanel(ext) {
-        this.panels.set(ext.id, ext);
-        this.bumpManifest();
-    }
-    registerOverlayToggle(toggle) {
-        this.toggles.set(toggle.id, toggle);
-        this.bumpManifest();
-    }
     registerDataFeed(name, fn, writeRateHz = 10) {
         if (this.dataFeeds.has(name)) {
             // Update fn/rate, keep feedIndex and hasWritten
@@ -183,8 +172,6 @@ class DevToolsAPIImpl {
     }
     getManifest() {
         return {
-            panels: Array.from(this.panels.values()),
-            toggles: Array.from(this.toggles.values()),
             dataFeeds: this.dataFeedNames.map((name, i) => ({
                 name,
                 feedIndex: i,
@@ -276,8 +263,6 @@ class DevToolsAPIImpl {
         return Array.from(this.sabStats.keys());
     }
     clear() {
-        this.panels.clear();
-        this.toggles.clear();
         this.dataFeeds.clear();
         this.dataFeedNames = [];
         this.commands.clear();
@@ -301,7 +286,7 @@ const _devtools = new DevToolsAPIImpl(DEVTOOLS_REALM);
  * the appropriate transport for data feeds (direct call vs SAB) and
  * commands (direct call vs RPC forwarding).
  *
- * Plugins import this and call registerPanel/registerDataFeed/registerCommand.
+ * Plugins import this and call registerDataFeed/registerCommand.
  * The same code works in both realms.
  */
 export const devtools = _devtools;

package/dist/modules/devtools/src/blitz/fonts.js

@@ -0,0 +1,75 @@
+// ============================================================================
+// fonts.ts — bind the host's real system fonts into the devtools dock doc.
+//
+// The OSR rasterizer ships a single embedded DejaVu Sans as the fallback for
+// every generic family — legible, but `monospace` resolves to it too, so the
+// console/REPL/tree read as proportional sans. Same fix as cruiser's
+// libraries/app-shell/fonts.ts: resolve the user's actual sans + mono faces
+// via fontconfig (fc-match -f %{file}), register them as `ui://` blobs on the
+// HtmlUiHost before mount, and emit @font-face rules the dock stylesheet
+// binds ahead of the generic fallbacks. Any failure (no fc-match, non-Linux
+// host, unreadable file) leaves the embedded fallback in place.
+// ============================================================================
+import { execFileSync } from "node:child_process";
+import { readFileSync } from "node:fs";
+// Blitz-dom only fetches a @font-face source whose format is detectable —
+// either an explicit format() hint or a file extension on the url — so the
+// urls carry the resolved file's real extension.
+const FACES = [
+    { family: "DevTools Sans", pattern: "sans-serif", urlName: "sans", weight: 400 },
+    { family: "DevTools Sans", pattern: "sans-serif:weight=bold", urlName: "sans-bold", weight: 700 },
+    { family: "DevTools Mono", pattern: "monospace", urlName: "mono", weight: 400 },
+    { family: "DevTools Mono", pattern: "monospace:weight=bold", urlName: "mono-bold", weight: 700 },
+];
+/** `fc-match -f %{file}` for a fontconfig pattern; null when fc-match is
+ *  absent or the match isn't a font file Blitz can load. */
+function fcFontFile(pattern) {
+    try {
+        const p = execFileSync("fc-match", ["-f", "%{file}", pattern], { timeout: 5000 }).toString().trim();
+        return /\.(ttf|otf|woff2?)$/i.test(p) ? p : null;
+    }
+    catch {
+        return null;
+    }
+}
+function fontExt(path) {
+    return path.match(/\.(ttf|otf|woff2?)$/i)?.[0] ?? ".ttf";
+}
+/**
+ * Register system sans + mono faces as `ui://` resources and return the
+ * @font-face CSS to prepend to the dock stylesheet. Returns "" when nothing
+ * registered — the stylesheet's named families then fail to resolve and the
+ * generic fallbacks (embedded DejaVu) apply.
+ *
+ * Call before mount — the doc backend applies resources synchronously and in
+ * order, so the first doc resolve sees them.
+ */
+export function registerDevtoolsFonts(sink) {
+    try {
+        // Both weights of a family are required: a 700 rule pointing at the
+        // regular file keeps bold text in-family instead of falling back.
+        const files = new Map();
+        for (const f of FACES)
+            files.set(f.urlName, fcFontFile(f.pattern) ?? "");
+        if (!files.get("sans"))
+            return "";
+        if (!files.get("mono"))
+            files.set("mono", files.get("sans"));
+        if (!files.get("sans-bold"))
+            files.set("sans-bold", files.get("sans"));
+        if (!files.get("mono-bold"))
+            files.set("mono-bold", files.get("mono"));
+        let css = "";
+        for (const f of FACES) {
+            const file = files.get(f.urlName);
+            const url = `ui://devtools-fonts/${f.urlName}${fontExt(file)}`;
+            sink.registerResource(url, readFileSync(file));
+            css += `@font-face { font-family:'${f.family}'; font-weight:${f.weight}; src:url('${url}'); }\n`;
+        }
+        return css;
+    }
+    catch {
+        // fc-match absent / unreadable font file — the embedded fallback applies.
+        return "";
+    }
+}

package/dist/modules/devtools/src/blitz/host.js

@@ -13,11 +13,13 @@
 import { createLogger } from "@downdraft/engine";
 import { CdpBridge, DevtoolsBackend } from "@downdraft/engine/libraries/devtools";
 import { HtmlUiHost } from "@downdraft/engine/modules/html-ui";
+import { registerDevtoolsFonts } from "./fonts.js";
 import { ConsolePanel } from "./panels/console.js";
 import { ElementsPanel } from "./panels/elements.js";
 import { GpuPanel } from "./panels/gpu.js";
 import { PerformancePanel } from "./panels/performance.js";
 import { SnapshotPanel } from "./panels/snapshot.js";
+import { esc } from "./panels/types.js";
 import { DEVTOOLS_CSS } from "./theme.js";
 const log = createLogger("info");
 const MIN_DOCK = 120;
@@ -42,6 +44,9 @@ export class BlitzDevtoolsHost {
     panelCtx;
     lastPanelRender = -1e9;
     lastSlowLog = 0;
+    /** @font-face css from registerDevtoolsFonts — "" means "embedded font
+     *  fallback", null means "not yet attempted". */
+    fontCss = null;
     constructor(opts) {
         this.opts = opts;
         this.surfaceW = opts.surface.clientWidth;
@@ -113,19 +118,42 @@ export class BlitzDevtoolsHost {
     show() {
         if (!this._ready || this.visible || this.disposed)
             return;
-        this.panel = this.opts.ui.mount(this.shellHtml(), {
-            id: "devtools",
-            rect: this.dockRect(),
-            // Above game overlays — menus/loading screens shouldn't bury the dock.
-            z: 1000,
-            scale: 1.5,
-            interactive: true,
-            // Devtools UI doesn't need vsync-rate raster — cap it so mutation
-            // bursts (console streams, snapshot refreshes) coalesce into ~66ms
-            // rasters instead of one raster per message.
-            maxFps: 15,
-            onEvent: (ev) => this.handleDocEvent(ev),
-        });
+        // Register real system fonts once per host — ui:// resources persist on
+        // the surface across dock remounts, and must land before the doc mounts
+        // so the first resolve sees them (embedded DejaVu fallback otherwise).
+        if (this.fontCss === null) {
+            const ui = this.opts.ui;
+            const rr = ui.registerResource?.bind(ui)
+                ?? (ui.host ? ui.host.registerResource.bind(ui.host) : undefined);
+            this.fontCss = rr ? registerDevtoolsFonts({ registerResource: rr }) : "";
+        }
+        try {
+            this.panel = this.opts.ui.mount(this.shellHtml(), {
+                id: "devtools",
+                rect: this.dockRect(),
+                // Above game overlays — menus/loading screens shouldn't bury the dock.
+                z: 1000,
+                // Native-res raster: the vendored glifo/FreeType path grid-fits hinted
+                // glyph stems to whole pixels — supersample factors >1 just blur that
+                // back out on downscale (and cost 2.25x the texture memory).
+                scale: 1,
+                // Ease wheel detents at pump cadence instead of jumping per event.
+                smoothWheel: true,
+                interactive: true,
+                // Devtools UI doesn't need vsync-rate raster — cap it so mutation
+                // bursts (console streams, snapshot refreshes) coalesce into ~66ms
+                // rasters instead of one raster per message.
+                maxFps: 15,
+                onEvent: (ev) => this.handleDocEvent(ev),
+            });
+        }
+        catch (err) {
+            // Mount fails when the ui worker is dead — stay hidden so the next F12
+            // retries cleanly instead of wedging on a half-mounted doc.
+            this.panel = null;
+            log.error("blitz-devtools-host", `dock mount failed: ${err}`);
+            return;
+        }
         this.syncProviders();
         this.renderTabs();
         this.activate(this.activeId);
@@ -150,8 +178,19 @@ export class BlitzDevtoolsHost {
         const t1 = performance.now();
         if (!this.visible)
             return;
-        this.syncProviders();
-        this.flush();
+        // Guarded like backend.update() above — a throwing panel render can't be
+        // allowed to kill the game frame hook that drives this pump.
+        try {
+            this.syncProviders();
+            this.flush();
+        }
+        catch (err) {
+            const tn = performance.now();
+            if (tn - this.lastSlowLog > 1000) {
+                this.lastSlowLog = tn;
+                log.warn("blitz-devtools-host", `panel render error: ${err}`);
+            }
+        }
         const t2 = performance.now();
         // ≤1/sec — these diagnostics used to feed the console panel's logger
         // sink, and each row forced another dock re-render: a self-feeding
@@ -204,11 +243,13 @@ export class BlitzDevtoolsHost {
     }
     // ── Dock layout ──
     dockRect() {
-        const h = Math.min(this.dockH, this.surfaceH - 60);
-        return { x: 0, y: this.surfaceH - h, w: this.surfaceW, h };
+        // A tiny surface (or a pathological resize event) must not produce a
+        // negative height — keep at least enough room for the tab strip.
+        const h = Math.max(48, Math.min(this.dockH, this.surfaceH - 60));
+        return { x: 0, y: Math.max(0, this.surfaceH - h), w: this.surfaceW, h };
     }
     shellHtml() {
-        return `<html><head><style>${DEVTOOLS_CSS}</style></head><body>
+        return `<html><head><style>${this.fontCss ?? ""}${DEVTOOLS_CSS}</style></head><body>
       <div id="dt-root">
         <div id="dt-grip" title="drag to resize"></div>
         <div id="dt-chrome">
@@ -224,7 +265,10 @@ export class BlitzDevtoolsHost {
     renderTabs() {
         if (!this.panel)
             return;
-        const tabs = [...this.panels.values()].map((p) => `<span class="tab${p.id === this.activeId ? " active" : ""}" data-action="dt.tab" data-tab="${p.id}">${p.title}</span>`).join("");
+        // esc() both interpolations — provider names feed panel ids/titles and
+        // arrive as raw strings (a game registering "x\"><img" would otherwise
+        // inject markup into the tab strip).
+        const tabs = [...this.panels.values()].map((p) => `<span class="tab${p.id === this.activeId ? " active" : ""}" data-action="dt.tab" data-tab="${esc(p.id)}">${esc(p.title)}</span>`).join("");
         this.panel.setInnerHtml("#dt-tabs", `<span class="brand">downdraft</span>${tabs}<span class="spacer"></span>
        <span class="hint">docked · F12</span><span id="dt-close" data-action="dt.close">✕</span>`);
         this.tabsDirty = false;
@@ -235,13 +279,28 @@ export class BlitzDevtoolsHost {
         this.activeId = id;
         const p = this.panels.get(id);
         this.renderTabs();
-        this.panel.setInnerHtml("#dt-top", p.renderTop?.() ?? "");
-        this.panel.setInnerHtml("#dt-bottom", p.renderBottom?.() ?? "");
+        try {
+            this.panel.setInnerHtml("#dt-top", p.renderTop?.() ?? "");
+            this.panel.setInnerHtml("#dt-bottom", p.renderBottom?.() ?? "");
+        }
+        catch (err) {
+            log.warn("blitz-devtools-host", `panel ${id} chrome render error: ${err}`);
+        }
         p.dirty = true;
         p.shellDirty = false;
-        this.panel.setInnerHtml("#dt-body", p.renderBody());
-        p.afterRender?.();
-        p.activate?.();
+        this.panel.setInnerHtml("#dt-body", this.safeBody(p));
+        try {
+            p.afterRender?.();
+        }
+        catch (err) {
+            log.warn("blitz-devtools-host", `panel ${id} afterRender error: ${err}`);
+        }
+        try {
+            p.activate?.();
+        }
+        catch (err) {
+            log.warn("blitz-devtools-host", `panel ${id} activate error: ${err}`);
+        }
         // Only the snapshot tab being viewed gets periodic provider refreshes;
         // fixed panels suspend auto-refresh entirely (manual Refresh still works).
         this.backend.providerWatch = p.providerSlot ?? -1;
@@ -307,10 +366,32 @@ export class BlitzDevtoolsHost {
         }
         if (p.dirty) {
             p.dirty = false;
-            if (p.flushDom?.() !== true) {
-                this.panel.setInnerHtml("#dt-body", p.renderBody());
+            let handled = false;
+            try {
+                handled = p.flushDom?.() === true;
             }
-            p.afterRender?.();
+            catch (err) {
+                log.warn("blitz-devtools-host", `panel ${p.id} flushDom error: ${err}`);
+            }
+            if (!handled)
+                this.panel.setInnerHtml("#dt-body", this.safeBody(p));
+            try {
+                p.afterRender?.();
+            }
+            catch (err) {
+                log.warn("blitz-devtools-host", `panel ${p.id} afterRender error: ${err}`);
+            }
+        }
+    }
+    /** renderBody that can't take the dock down — the error surfaces in-panel
+     *  (and the next push retries since dirty just flips back on). */
+    safeBody(p) {
+        try {
+            return p.renderBody();
+        }
+        catch (err) {
+            log.warn("blitz-devtools-host", `panel ${p.id} renderBody error: ${err}`);
+            return `<div class="status-banner error">panel render error: ${esc(String(err))}</div>`;
         }
     }
     setStatus(text) {
@@ -345,8 +426,10 @@ export class BlitzDevtoolsHost {
                 return;
             }
         }
+        // Left-click only — routing actions on contextmenu meant a right-click
+        // on a tab/button fired it instead of just focusing.
         const action = ev.d?.action;
-        if ((ev.t === "click" || ev.t === "contextmenu") && action) {
+        if (ev.t === "click" && action) {
             if (action === "dt.tab") {
                 const id = ev.d.tab;
                 if (id)
@@ -357,11 +440,21 @@ export class BlitzDevtoolsHost {
                 this.hide();
                 return;
             }
-            this.panels.get(this.activeId)?.onAction?.(ev.d, ev);
+            try {
+                this.panels.get(this.activeId)?.onAction?.(ev.d, ev);
+            }
+            catch (err) {
+                log.warn("blitz-devtools-host", `panel action error: ${err}`);
+            }
             return;
         }
         // Everything else (input, keydown/up, scroll, focus…) → active panel.
-        this.panels.get(this.activeId)?.onEvent?.(ev);
+        try {
+            this.panels.get(this.activeId)?.onEvent?.(ev);
+        }
+        catch (err) {
+            log.warn("blitz-devtools-host", `panel event error: ${err}`);
+        }
     }
 }
 /**
@@ -387,5 +480,6 @@ export function createSelfHostedDevtoolsUi(ctx) {
         host,
         mount: (markup, spec) => host.mount({ ...spec, html: markup }),
         docCaps: () => host.docCaps,
+        registerResource: (url, bytes) => host.registerResource(url, bytes),
     };
 }

package/dist/modules/devtools/src/blitz/panels/console.js

@@ -101,7 +101,7 @@ export class ConsolePanel {
     onBackendEvent(event, data) {
         if (event === "console") {
             const e = data;
-            this.rows.push({ text: e.text ?? "", severity: e.severity ?? 0, thread: e.thread ?? "main", seq: this.seq++ });
+            this.rows.push({ text: String(e?.text ?? ""), severity: e?.severity ?? 0, thread: e?.thread ?? "main", seq: this.seq++ });
             if (this.rows.length > MAX_ROWS)
                 this.rows.splice(0, this.rows.length - MAX_ROWS);
             this.dirty = true;
@@ -113,15 +113,24 @@ export class ConsolePanel {
         }
         else if (event === "threads") {
             const list = data ?? [];
-            this.threads = [{ id: "main", name: "main", kind: 0 }, ...list.filter((t) => t.id !== "main")];
-            if (!this.threads.some((t) => t.id === this.replThread))
+            const next = [{ id: "main", name: "main", kind: 0 }, ...list.filter((t) => t.id !== "main")];
+            // Thread chips live in the bottom chrome — flag it so the row
+            // actually re-renders when a worker appears or disappears.
+            const changed = next.length !== this.threads.length
+                || next.some((t, i) => t.id !== this.threads[i].id || t.name !== this.threads[i].name);
+            this.threads = next;
+            if (!this.threads.some((t) => t.id === this.replThread)) {
                 this.replThread = "main";
+                this.shellDirty = true;
+            }
+            if (changed)
+                this.shellDirty = true;
         }
     }
     onAction(data, _ev) {
         const act = data.action;
         if (act === "console.clear") {
-            void this.ctx.call("console.clear");
+            void this.ctx.call("console.clear").catch(() => { });
         }
         else if (act === "console.sev") {
             this.minSev = (this.minSev + 1) % SEV_NAMES.length;
@@ -171,8 +180,11 @@ export class ConsolePanel {
                 this.replValue = this.history[--this.histIdx];
                 this.ctx.setValue("[data-dt=repl]", this.replValue);
             }
-            else if (ev.k === "ArrowDown" && this.histIdx < this.history.length - 1) {
-                this.replValue = this.history[++this.histIdx];
+            else if (ev.k === "ArrowDown" && this.histIdx >= 0 && this.histIdx < this.history.length) {
+                // Stepping past the newest entry restores the empty input —
+                // previously the last history item was unreachable-to-leave.
+                this.histIdx++;
+                this.replValue = this.histIdx < this.history.length ? this.history[this.histIdx] : "";
                 this.ctx.setValue("[data-dt=repl]", this.replValue);
             }
         }
@@ -205,7 +217,7 @@ export class ConsolePanel {
             else {
                 const r = res?.result;
                 this.addRow({
-                    text: typeof r === "string" ? r : JSON.stringify(r, null, 2),
+                    text: typeof r === "string" ? r : (r === undefined ? "undefined" : JSON.stringify(r, null, 2)),
                     severity: 0, thread: this.replThread,
                 });
             }