@three-flatland/devtools 0.1.0-alpha.3 → 1.0.0-alpha.6

package/dist/devtools-client.js

@@ -1,852 +1,880 @@
-import {
-  ACK_INTERVAL_MS,
-  DEBUG_PROTOCOL_VERSION,
-  DISCOVERY_CHANNEL,
-  SERVER_LIVENESS_MS,
-  providerChannelName
-} from "three-flatland/debug-protocol";
 import { tracePerf } from "./perf-trace.js";
+import { ACK_INTERVAL_MS, DEBUG_PROTOCOL_VERSION, DISCOVERY_CHANNEL, SERVER_LIVENESS_MS, providerChannelName } from "three-flatland/debug-protocol";
+//#region src/devtools-client.ts
+/**
+* Discovery retry backoff. Starts at `QUERY_RETRY_MIN_MS`, doubles each
+* attempt, caps at `QUERY_RETRY_MAX_MS`, and gives up after `QUERY_MAX_RETRIES`
+* total tries. After giving up, a provider that comes online later will
+* still wire us up via its own startup `provider:announce`.
+*/
 const QUERY_RETRY_MIN_MS = 500;
 const QUERY_RETRY_MAX_MS = 5e3;
 const QUERY_MAX_RETRIES = 10;
+/**
+* Size of the client-side decoded series rings. Sized generously so
+* downstream consumers (graphs, percentile detail panels) have plenty
+* of history across both 4 Hz batch and 60 Hz sample cadences. 1024 ×
+* Float32 × ~9 fields ≈ 36 KB total — negligible.
+*/
 const CLIENT_SERIES_SIZE = 1024;
-const EMPTY_SAMPLE = new Float32Array(0);
-class DevtoolsClient {
-  id;
-  state;
-  /** Shared discovery bus — carries query/announce/gone only. */
-  _discoveryBus;
-  /** Per-provider data bus. Opened when we subscribe; closed on switch / gone. */
-  _dataBus = null;
-  /** Bound handler for the current `_dataBus`. Tracked so we can detach on close. */
-  _dataHandler = null;
-  _features;
-  /**
-   * Registry entry filter. `null` = all entries; `string[]` = only
-   * these. Starts empty-array so providers don't drain (sometimes
-   * expensive) registry payloads until the pane actually needs them.
-   */
-  _registrySelection = [];
-  /**
-   * Buffer subscription. Map of entry-name → { mode, thumbSize? }.
-   * Empty map = metadata-only (consumer is connected to the `buffers`
-   * feature but isn't actually watching anything — provider skips all
-   * readbacks). `null` is not a distinct state; represented by `{}`.
-   */
-  _buffersSelection = {};
-  _listeners = /* @__PURE__ */ new Set();
-  _chunkListeners = /* @__PURE__ */ new Set();
-  _rawMessageListeners = /* @__PURE__ */ new Set();
-  _ackTimer = null;
-  _livenessTimer = null;
-  _queryRetryTimer = null;
-  _lastServerAt = 0;
-  _subscribed = false;
-  _disposed = false;
-  /** Known providers by id — updated live via `provider:announce` + `provider:gone`. */
-  _providers = /* @__PURE__ */ new Map();
-  constructor(options) {
-    this.id = generateUuid();
-    this._features = [...options.features];
-    if (options.onChange) this._listeners.add(options.onChange);
-    this._discoveryBus = new BroadcastChannel(options.discoveryChannelName ?? DISCOVERY_CHANNEL);
-    const mkSeries = () => ({
-      data: new Float32Array(CLIENT_SERIES_SIZE),
-      write: 0,
-      length: 0
-    });
-    this.state = {
-      series: {
-        fps: mkSeries(),
-        cpuMs: mkSeries(),
-        gpuMs: mkSeries(),
-        heapUsedMB: mkSeries(),
-        drawCalls: mkSeries(),
-        triangles: mkSeries(),
-        primitives: mkSeries(),
-        geometries: mkSeries(),
-        textures: mkSeries()
-      },
-      registry: /* @__PURE__ */ new Map(),
-      buffers: /* @__PURE__ */ new Map(),
-      batches: { frame: 0, passes: [], batches: [] },
-      providers: [],
-      selectedProviderId: null,
-      serverAlive: false,
-      serverLagMs: 0
-    };
-    this._discoveryBus.addEventListener("message", (ev) => {
-      this._onDiscoveryMessage(ev.data);
-    });
-  }
-  /**
-   * Begin discovery + subscription. Sends a `provider:query`, waits
-   * `DISCOVERY_WINDOW_MS` for `provider:announce` responses, then picks
-   * the best provider (user > system) and subscribes to it.
-   *
-   * Idempotent — calling again while already started is a no-op.
-   */
-  start() {
-    if (this._disposed || this._subscribed) return;
-    this._subscribed = true;
-    this._sendQuery();
-    let retries = 0;
-    let nextDelay = QUERY_RETRY_MIN_MS;
-    const tick = () => {
-      if (this._disposed || this.state.selectedProviderId !== null) {
-        this._queryRetryTimer = null;
-        return;
-      }
-      if (retries >= QUERY_MAX_RETRIES) {
-        this._queryRetryTimer = null;
-        return;
-      }
-      retries++;
-      this._sendQuery();
-      nextDelay = Math.min(nextDelay * 2, QUERY_RETRY_MAX_MS);
-      this._queryRetryTimer = setTimeout(tick, nextDelay);
-    };
-    this._queryRetryTimer = setTimeout(tick, nextDelay);
-    this._livenessTimer = setInterval(() => this._checkLiveness(), 1e3);
-  }
-  _sendQuery() {
-    this._postDiscovery({
-      type: "provider:query",
-      payload: { requesterId: this.id }
-    });
-  }
-  /**
-   * Update the feature set. Re-posts `subscribe` on the current
-   * provider's data channel.
-   */
-  setFeatures(features) {
-    if (sameSet(this._features, features)) return;
-    this._features = [...features];
-    this._resubscribe();
-  }
-  /**
-   * Update the registry entry filter. Pass `null` for "every entry",
-   * `[]` to stop all registry traffic, or a list of names to narrow.
-   * Re-posts `subscribe` if the filter actually changed.
-   */
-  /**
-   * Narrow which registry entries the provider should ship samples
-   * for. `null` = all entries; `[]` = none; `[name, …]` = only these.
-   * Metadata still flows regardless — only sample bytes are gated.
-   */
-  setRegistry(names) {
-    if (sameFilter(this._registrySelection, names)) return;
-    this._registrySelection = names === null ? null : [...names];
-    this._resubscribe();
-  }
-  /**
-   * Update the buffer subscription. Map of entry-name → (mode, thumbSize?).
-   *   - Empty map / missing names → metadata-only (provider sends no pixels,
-   *     runs no readbacks). This is the idle state when no preview or
-   *     modal is visible.
-   *   - `{ name: { mode: 'thumbnail', thumbSize: 256 } }` → small
-   *     downsampled preview. Use when a thumbnail card is visible.
-   *   - `{ name: { mode: 'stream' } }` → full-size VP9 video stream.
-   *     Use when the fullscreen modal is open.
-   *
-   * Mode changes (incl. unsubscribing) take effect on the next
-   * provider flush; the producer will drop old readbacks immediately.
-   */
-  setBuffers(subscription) {
-    if (sameBufferSubscription(this._buffersSelection, subscription)) return;
-    this._buffersSelection = { ...subscription };
-    this._resubscribe();
-  }
-  _resubscribe() {
-    if (this._subscribed && this._dataBus !== null) {
-      const hasBuffers = Object.keys(this._buffersSelection).length > 0;
-      this._postData({
-        type: "subscribe",
-        payload: {
-          id: this.id,
-          features: this._features,
-          registry: this._registrySelection ?? void 0,
-          buffers: hasBuffers ? this._buffersSelection : void 0
-        }
-      });
-    }
-  }
-  /**
-   * Manually switch to a different provider. No-op if unknown or if
-   * already selected. Closes the old data channel and opens the new one.
-   */
-  selectProvider(providerId) {
-    if (!this._providers.has(providerId)) return;
-    if (this.state.selectedProviderId === providerId) return;
-    this._leaveDataChannel();
-    this.state.selectedProviderId = providerId;
-    this._resetAccumulatedState();
-    this._joinDataChannel(providerId);
-    this._postData({
-      type: "subscribe",
-      payload: {
-        id: this.id,
-        features: this._features,
-        registry: this._registrySelection ?? void 0,
-        buffers: Object.keys(this._buffersSelection).length > 0 ? this._buffersSelection : void 0
-      }
-    });
-    this._fire();
-  }
-  dispose() {
-    if (this._disposed) return;
-    this._disposed = true;
-    this._leaveDataChannel();
-    this._subscribed = false;
-    if (this._ackTimer !== null) {
-      clearInterval(this._ackTimer);
-      this._ackTimer = null;
-    }
-    if (this._livenessTimer !== null) {
-      clearInterval(this._livenessTimer);
-      this._livenessTimer = null;
-    }
-    if (this._queryRetryTimer !== null) {
-      clearTimeout(this._queryRetryTimer);
-      this._queryRetryTimer = null;
-    }
-    try {
-      this._discoveryBus.close();
-    } catch {
-    }
-  }
-  /**
-   * Open a fresh per-provider data channel and start listening on it.
-   * Caller is responsible for posting the initial `subscribe`.
-   */
-  _joinDataChannel(providerId) {
-    this._dataBus = new BroadcastChannel(providerChannelName(providerId));
-    this._dataHandler = (ev) => {
-      this._onDataMessage(ev.data);
-    };
-    this._dataBus.addEventListener("message", this._dataHandler);
-  }
-  /**
-   * Send `unsubscribe` (if we have someone to tell) and close the data
-   * channel. Idempotent — safe to call when there's no active channel.
-   */
-  _leaveDataChannel() {
-    if (this._dataBus !== null) {
-      if (this._subscribed) {
-        try {
-          this._postData({ type: "unsubscribe", payload: { id: this.id } });
-        } catch {
-        }
-      }
-      if (this._dataHandler !== null) {
-        try {
-          this._dataBus.removeEventListener("message", this._dataHandler);
-        } catch {
-        }
-      }
-      try {
-        this._dataBus.close();
-      } catch {
-      }
-      this._dataBus = null;
-      this._dataHandler = null;
-    }
-  }
-  // ── Internal ──────────────────────────────────────────────────────────
-  /**
-   * Handler for the shared discovery bus. Only discovery messages land
-   * here by protocol; anything else is ignored.
-   */
-  _onDiscoveryMessage(msg) {
-    if (!msg || typeof msg !== "object" || !("type" in msg)) return;
-    tracePerf(msg);
-    switch (msg.type) {
-      case "provider:announce": {
-        const id = msg.payload.identity.id;
-        this._providers.set(id, msg.payload.identity);
-        this.state.providers = Array.from(this._providers.values());
-        this._fire();
-        if (this.state.selectedProviderId === null) this._pickProviderAndSubscribe();
-        break;
-      }
-      case "provider:gone": {
-        const id = msg.payload.id;
-        if (!this._providers.has(id)) return;
-        this._providers.delete(id);
-        this.state.providers = Array.from(this._providers.values());
-        if (this.state.selectedProviderId === id) {
-          this._leaveDataChannel();
-          this.state.selectedProviderId = null;
-          this._resetAccumulatedState();
-          this._pickProviderAndSubscribe();
-        }
-        this._fire();
-        break;
-      }
-      default:
-        break;
-    }
-  }
-  /**
-   * Handler for the per-provider data channel. Everything here is
-   * already implicitly addressed to us (we opened the channel with the
-   * provider's id), so no per-message filtering is required beyond
-   * matching our consumer `id` on `subscribe:ack`.
-   */
-  _onDataMessage(msg) {
-    if (!msg || typeof msg !== "object" || !("type" in msg)) return;
-    tracePerf(msg);
-    if (this._rawMessageListeners.size > 0) {
-      for (const cb of this._rawMessageListeners) {
-        try {
-          cb(msg, "in");
-        } catch {
-        }
-      }
-    }
-    switch (msg.type) {
-      case "subscribe:ack": {
-        if (msg.payload.id !== this.id) return;
-        this._markServerAlive();
-        this._applyEnv(msg.payload.env);
-        if (this._ackTimer === null) {
-          this._ackTimer = setInterval(() => this._sendAck(), ACK_INTERVAL_MS);
-        }
-        this._fire();
-        break;
-      }
-      case "data": {
-        this._markServerAlive();
-        this.state.frame = msg.payload.frame;
-        const features = msg.payload.features;
-        if (features.stats !== void 0) this._applyStats(features.stats);
-        if (features.env !== void 0) this._applyEnv(features.env);
-        if (features.registry !== void 0) this._applyRegistry(features.registry);
-        if (features.buffers !== void 0) this._applyBuffers(features.buffers);
-        if (features.batches !== void 0) this._applyBatches(features.batches);
-        this._fire();
-        break;
-      }
-      case "buffer:chunk": {
-        this._markServerAlive();
-        const payload = msg.payload;
-        for (const cb of this._chunkListeners) {
-          try {
-            cb(payload);
-          } catch {
-          }
-        }
-        break;
-      }
-      case "buffer:raw": {
-        this._markServerAlive();
-        const payload = msg.payload;
-        let snap = this.state.buffers.get(payload.name);
-        if (snap !== void 0) {
-          snap.pixels = new Uint8Array(payload.data);
-          snap.width = payload.width;
-          snap.height = payload.height;
-          snap.version++;
-        } else {
-          snap = {
-            name: payload.name,
-            width: payload.width,
-            height: payload.height,
-            srcWidth: payload.width,
-            srcHeight: payload.height,
-            pixelType: "rgba8",
-            display: "colors",
-            version: 0,
-            pixels: new Uint8Array(payload.data)
-          };
-          this.state.buffers.set(payload.name, snap);
-        }
-        this._fire();
-        break;
-      }
-      case "ping": {
-        this._markServerAlive();
-        break;
-      }
-      default:
-        break;
-    }
-  }
-  _markServerAlive() {
-    this._lastServerAt = Date.now();
-    if (!this.state.serverAlive) {
-      this.state.serverAlive = true;
-      this._fire();
-    }
-  }
-  /**
-   * Pick the best provider from the currently-known set and subscribe
-   * to it. Preference: `user` over `system`; first-announced as
-   * tiebreak. No-op if zero providers are known (we'll stay waiting;
-   * any future `provider:announce` that arrives doesn't auto-trigger
-   * this — call it again or restart discovery).
-   */
-  _pickProviderAndSubscribe() {
-    if (this.state.selectedProviderId !== null) return;
-    const providers = Array.from(this._providers.values());
-    if (providers.length === 0) return;
-    const user = providers.find((p) => p.kind === "user");
-    const chosen = user ?? providers[0];
-    this.state.selectedProviderId = chosen.id;
-    this._joinDataChannel(chosen.id);
-    this._postData({
-      type: "subscribe",
-      payload: {
-        id: this.id,
-        features: this._features,
-        registry: this._registrySelection ?? void 0,
-        buffers: Object.keys(this._buffersSelection).length > 0 ? this._buffersSelection : void 0
-      }
-    });
-    this._fire();
-  }
-  /** Clear all feature-derived state so the next data packet can start fresh. */
-  _resetAccumulatedState() {
-    this.state.frame = void 0;
-    this._applyStats(null);
-    this._applyEnv(null);
-    this.state.registry.clear();
-    this.state.buffers.clear();
-    this._applyBatches(null);
-  }
-  /**
-   * Apply a stats batch. Null = reset (feature cleared / provider gone).
-   * Otherwise: decode each typed array onto the matching Float32 ring
-   * and update the scalar with the batch mean (natural smoothing for
-   * the text label).
-   */
-  _applyStats(batch) {
-    if (batch === null) {
-      this.state.drawCalls = void 0;
-      this.state.triangles = void 0;
-      this.state.primitives = void 0;
-      this.state.geometries = void 0;
-      this.state.textures = void 0;
-      this.state.cpuMs = void 0;
-      this.state.fps = void 0;
-      this.state.gpuMs = void 0;
-      this.state.heapUsedMB = void 0;
-      this.state.heapLimitMB = void 0;
-      const s2 = this.state.series;
-      s2.fps.write = 0;
-      s2.fps.length = 0;
-      s2.cpuMs.write = 0;
-      s2.cpuMs.length = 0;
-      s2.gpuMs.write = 0;
-      s2.gpuMs.length = 0;
-      s2.heapUsedMB.write = 0;
-      s2.heapUsedMB.length = 0;
-      s2.drawCalls.write = 0;
-      s2.drawCalls.length = 0;
-      s2.triangles.write = 0;
-      s2.triangles.length = 0;
-      s2.primitives.write = 0;
-      s2.primitives.length = 0;
-      s2.geometries.write = 0;
-      s2.geometries.length = 0;
-      s2.textures.write = 0;
-      s2.textures.length = 0;
-      return;
-    }
-    const count = batch.count;
-    if (count <= 0) return;
-    const s = this.state.series;
-    if (batch.fps) this.state.fps = this._ingestI16(s.fps, batch.fps, count, 0.1);
-    if (batch.cpuMs) this.state.cpuMs = this._ingestU16(s.cpuMs, batch.cpuMs, count, 0.01);
-    if (batch.gpuMs) this.state.gpuMs = this._ingestU16(s.gpuMs, batch.gpuMs, count, 0.01);
-    if (batch.heapUsedMB) this.state.heapUsedMB = this._ingestU16(s.heapUsedMB, batch.heapUsedMB, count, 1);
-    if (batch.drawCalls) this.state.drawCalls = this._ingestU32(s.drawCalls, batch.drawCalls, count);
-    if (batch.triangles) this.state.triangles = this._ingestU32(s.triangles, batch.triangles, count);
-    if (batch.primitives) this.state.primitives = this._ingestU32(s.primitives, batch.primitives, count);
-    if (batch.geometries) this.state.geometries = this._ingestU32(s.geometries, batch.geometries, count);
-    if (batch.textures) this.state.textures = this._ingestU32(s.textures, batch.textures, count);
-    if (batch.heapLimitMB !== void 0) this.state.heapLimitMB = batch.heapLimitMB;
-  }
-  /**
-   * Append `count` samples from a scaled integer view to a Float32 ring;
-   * return the batch mean (scaled). Zero-alloc past the ring itself.
-   */
-  _ingestI16(ring, src, count, scale) {
-    const size = ring.data.length;
-    let sum = 0;
-    let w = ring.write;
-    for (let i = 0; i < count; i++) {
-      const v = src[i] * scale;
-      ring.data[w] = v;
-      sum += v;
-      w = (w + 1) % size;
-    }
-    ring.write = w;
-    ring.length = Math.min(size, ring.length + count);
-    return sum / count;
-  }
-  _ingestU16(ring, src, count, scale) {
-    const size = ring.data.length;
-    let sum = 0;
-    let w = ring.write;
-    for (let i = 0; i < count; i++) {
-      const v = src[i] * scale;
-      ring.data[w] = v;
-      sum += v;
-      w = (w + 1) % size;
-    }
-    ring.write = w;
-    ring.length = Math.min(size, ring.length + count);
-    return sum / count;
-  }
-  _ingestU32(ring, src, count) {
-    const size = ring.data.length;
-    let sum = 0;
-    let w = ring.write;
-    for (let i = 0; i < count; i++) {
-      const v = src[i];
-      ring.data[w] = v;
-      sum += v;
-      w = (w + 1) % size;
-    }
-    ring.write = w;
-    ring.length = Math.min(size, ring.length + count);
-    return sum / count;
-  }
-  /**
-   * Apply a batches feature payload — replaces the snapshot wholesale.
-   * The wire arrays are scratch pools on the producer; we truncate by
-   * the provided counts and copy fields into persistent snapshot
-   * objects the UI can hold across subsequent frames.
-   *
-   * The client-side snapshot arrays grow monotonically to the high
-   * watermark and entries are overwritten in place — same alloc
-   * discipline as the producer.
-   */
-  _applyBatches(delta) {
-    if (delta === null) {
-      this.state.batches.frame = 0;
-      this.state.batches.passes.length = 0;
-      this.state.batches.batches.length = 0;
-      return;
-    }
-    this.state.batches.frame = delta.frame;
-    const passesIn = delta.passes;
-    const passCount = delta.passCount | 0;
-    const passesOut = this.state.batches.passes;
-    if (passesIn !== void 0) {
-      for (let i = 0; i < passCount; i++) {
-        const src = passesIn[i];
-        if (src === void 0) continue;
-        let dst = passesOut[i];
-        if (dst === void 0) {
-          dst = { label: "", calls: 0, triangles: 0, cpuMs: 0, depth: 0, parent: -1 };
-          passesOut[i] = dst;
-        }
-        dst.label = src.label;
-        dst.calls = src.calls;
-        dst.triangles = src.triangles;
-        dst.cpuMs = src.cpuMs;
-        dst.depth = src.depth;
-        dst.parent = src.parent;
-      }
-    }
-    if (passesOut.length > passCount) passesOut.length = passCount;
-    const batchesIn = delta.batches;
-    const batchCount = delta.batchCount | 0;
-    const batchesOut = this.state.batches.batches;
-    if (batchesIn !== void 0) {
-      for (let i = 0; i < batchCount; i++) {
-        const src = batchesIn[i];
-        if (src === void 0) continue;
-        let dst = batchesOut[i];
-        if (dst === void 0) {
-          dst = {
-            runKey: 0,
-            materialId: 0,
-            layer: 0,
-            materialName: "",
-            spriteCount: 0,
-            batchIdx: 0,
-            kind: "sprite",
-            label: ""
-          };
-          batchesOut[i] = dst;
-        }
-        dst.runKey = src.runKey;
-        dst.materialId = src.materialId;
-        dst.layer = src.layer;
-        dst.materialName = src.materialName;
-        dst.spriteCount = src.spriteCount;
-        dst.batchIdx = src.batchIdx;
-        dst.kind = src.kind ?? "sprite";
-        dst.label = src.label ?? "";
-      }
-    }
-    if (batchesOut.length > batchCount) batchesOut.length = batchCount;
-  }
-  /**
-   * Apply a registry delta. `entries[name] === null` → remove;
-   * `entries[name]` present → upsert a snapshot keyed by `name`.
-   * A `null` batch (feature cleared) drops every entry.
-   */
-  _applyRegistry(delta) {
-    if (delta === null) {
-      this.state.registry.clear();
-      return;
-    }
-    if (!delta.entries) return;
-    const entries = delta.entries;
-    for (const name in entries) {
-      const d = entries[name];
-      if (d === void 0) continue;
-      if (d === null) {
-        this.state.registry.delete(name);
-        continue;
-      }
-      let snap = this.state.registry.get(name);
-      const sample = d.sample ?? snap?.sample ?? EMPTY_SAMPLE;
-      if (snap === void 0) {
-        snap = {
-          name,
-          kind: d.kind,
-          version: d.version,
-          count: d.count,
-          sample,
-          label: d.label
-        };
-        this.state.registry.set(name, snap);
-      } else {
-        snap.kind = d.kind;
-        snap.version = d.version;
-        snap.count = d.count;
-        snap.sample = sample;
-        snap.label = d.label;
-      }
-    }
-  }
-  /**
-   * Apply a buffers delta. Metadata (width/height/version/pixelType)
-   * ships regardless of the client's selection; `pixels` only arrives
-   * when this entry is in the current selection. Retain the previous
-   * `pixels` when the delta is metadata-only so the UI keeps showing
-   * the last thumbnail while browsing.
-   */
-  _applyBuffers(delta) {
-    if (delta === null) {
-      this.state.buffers.clear();
-      return;
-    }
-    if (!delta.entries) return;
-    const entries = delta.entries;
-    for (const name in entries) {
-      const d = entries[name];
-      if (d === void 0) continue;
-      if (d === null) {
-        this.state.buffers.delete(name);
-        continue;
-      }
-      let snap = this.state.buffers.get(name);
-      const pixels = d.pixels ?? snap?.pixels ?? null;
-      const isFloat = d.pixelType === "rgba16f" || d.pixelType === "rgba32f";
-      const display = d.display ?? (isFloat ? "normalize" : "colors");
-      const srcW = d.srcWidth ?? d.width;
-      const srcH = d.srcHeight ?? d.height;
-      if (snap === void 0) {
-        snap = {
-          name,
-          width: d.width,
-          height: d.height,
-          srcWidth: srcW,
-          srcHeight: srcH,
-          pixelType: d.pixelType,
-          display,
-          version: d.version,
-          pixels,
-          label: d.label
-        };
-        this.state.buffers.set(name, snap);
-      } else {
-        snap.width = d.width;
-        snap.height = d.height;
-        snap.srcWidth = srcW;
-        snap.srcHeight = srcH;
-        snap.pixelType = d.pixelType;
-        snap.display = display;
-        snap.version = d.version;
-        snap.pixels = pixels;
-        snap.label = d.label;
-      }
-    }
-  }
-  _applyEnv(delta) {
-    if (delta === null) {
-      this.state.threeFlatlandVersion = void 0;
-      this.state.threeRevision = void 0;
-      this.state.backendName = void 0;
-      this.state.backendTrackTimestamp = void 0;
-      this.state.backendDisjoint = void 0;
-      this.state.gpuModeEnabled = void 0;
-      this.state.canvasWidth = void 0;
-      this.state.canvasHeight = void 0;
-      this.state.canvasPixelRatio = void 0;
-      return;
-    }
-    if ("threeFlatlandVersion" in delta) this.state.threeFlatlandVersion = delta.threeFlatlandVersion ?? void 0;
-    if ("threeRevision" in delta) this.state.threeRevision = delta.threeRevision ?? void 0;
-    if (delta.backend !== void 0) {
-      const b = delta.backend;
-      if (b === null) {
-        this.state.backendName = void 0;
-        this.state.backendTrackTimestamp = void 0;
-        this.state.backendDisjoint = void 0;
-        this.state.gpuModeEnabled = void 0;
-      } else {
-        if ("name" in b) this.state.backendName = b.name ?? void 0;
-        if ("trackTimestamp" in b) this.state.backendTrackTimestamp = b.trackTimestamp ?? void 0;
-        if ("disjoint" in b) this.state.backendDisjoint = b.disjoint ?? void 0;
-        if ("gpuModeEnabled" in b) this.state.gpuModeEnabled = b.gpuModeEnabled ?? void 0;
-      }
-    }
-    if (delta.canvas !== void 0) {
-      const c = delta.canvas;
-      if (c === null) {
-        this.state.canvasWidth = void 0;
-        this.state.canvasHeight = void 0;
-        this.state.canvasPixelRatio = void 0;
-      } else {
-        if ("width" in c) this.state.canvasWidth = c.width ?? void 0;
-        if ("height" in c) this.state.canvasHeight = c.height ?? void 0;
-        if ("pixelRatio" in c) this.state.canvasPixelRatio = c.pixelRatio ?? void 0;
-      }
-    }
-  }
-  _checkLiveness() {
-    const now = Date.now();
-    const lag = this._lastServerAt === 0 ? now : now - this._lastServerAt;
-    this.state.serverLagMs = lag;
-    if (this._lastServerAt !== 0 && lag > SERVER_LIVENESS_MS) {
-      if (this.state.serverAlive) {
-        this.state.serverAlive = false;
-      }
-      if (this._dataBus !== null) {
-        this._postData({
-          type: "subscribe",
-          payload: {
-            id: this.id,
-            features: this._features,
-            registry: this._registrySelection ?? void 0,
-            buffers: Object.keys(this._buffersSelection).length > 0 ? this._buffersSelection : void 0
-          }
-        });
-      }
-    }
-    this._fire();
-  }
-  _sendAck() {
-    if (this._disposed || this._dataBus === null) return;
-    this._postData({ type: "ack", payload: { id: this.id } });
-  }
-  _postDiscovery(body) {
-    const msg = { v: DEBUG_PROTOCOL_VERSION, ts: Date.now(), ...body };
-    this._fireRawMessage(msg, "out");
-    try {
-      this._discoveryBus.postMessage(msg);
-    } catch {
-    }
-  }
-  _postData(body) {
-    if (this._dataBus === null) return;
-    const msg = { v: DEBUG_PROTOCOL_VERSION, ts: Date.now(), ...body };
-    this._fireRawMessage(msg, "out");
-    try {
-      this._dataBus.postMessage(msg);
-    } catch {
-    }
-  }
-  _fireRawMessage(msg, direction) {
-    if (this._rawMessageListeners.size === 0) return;
-    for (const cb of this._rawMessageListeners) {
-      try {
-        cb(msg, direction);
-      } catch {
-      }
-    }
-  }
-  /** Subscribe to state-change events. Returns an unsubscribe function. */
-  addListener(cb) {
-    this._listeners.add(cb);
-    return () => {
-      this._listeners.delete(cb);
-    };
-  }
-  /** Explicit remove — equivalent to calling the unsubscribe returned from `addListener`. */
-  removeListener(cb) {
-    this._listeners.delete(cb);
-  }
-  /** Subscribe to incoming WebCodecs buffer chunks. Returns an unsubscribe function. */
-  addChunkListener(cb) {
-    this._chunkListeners.add(cb);
-    return () => {
-      this._chunkListeners.delete(cb);
-    };
-  }
-  /**
-   * Subscribe to every bus message — both inbound (from providers) and
-   * outbound (our own `subscribe`/`ack`/etc.). Used by the dashboard's
-   * protocol-log panel. Listeners fire on the hot path so keep them
-   * cheap — filter and format lazily.
-   */
-  addRawMessageListener(cb) {
-    this._rawMessageListeners.add(cb);
-    return () => {
-      this._rawMessageListeners.delete(cb);
-    };
-  }
-  _fire() {
-    for (const cb of this._listeners) {
-      try {
-        cb(this.state);
-      } catch {
-      }
-    }
-  }
-}
+/** Shared zero-length placeholder used for metadata-only registry snapshots. */
+const EMPTY_SAMPLE = /* @__PURE__ */ new Float32Array(0);
+/**
+* Bus consumer. One per viewing surface (tweakpane panel, pop-out
+* window, remote dashboard). Owns:
+*
+*   - A stable consumer id (UUID v4).
+*   - A `BroadcastChannel` subscription.
+*   - Accumulated `DevtoolsState` derived from `data` packet deltas.
+*   - Ack timer (1 s, starts on `subscribe:ack`).
+*   - Server-liveness monitor; re-subscribes if no server message
+*     within `SERVER_LIVENESS_MS`.
+*
+* Call `start()` to send the initial subscribe + begin timers.
+* `dispose()` sends unsubscribe, clears timers, closes the channel.
+*/
+var DevtoolsClient = class {
+	id;
+	state;
+	/** Shared discovery bus — carries query/announce/gone only. */
+	_discoveryBus;
+	/** Per-provider data bus. Opened when we subscribe; closed on switch / gone. */
+	_dataBus = null;
+	/** Bound handler for the current `_dataBus`. Tracked so we can detach on close. */
+	_dataHandler = null;
+	_features;
+	/**
+	* Registry entry filter. `null` = all entries; `string[]` = only
+	* these. Starts empty-array so providers don't drain (sometimes
+	* expensive) registry payloads until the pane actually needs them.
+	*/
+	_registrySelection = [];
+	/**
+	* Buffer subscription. Map of entry-name → { mode, thumbSize? }.
+	* Empty map = metadata-only (consumer is connected to the `buffers`
+	* feature but isn't actually watching anything — provider skips all
+	* readbacks). `null` is not a distinct state; represented by `{}`.
+	*/
+	_buffersSelection = {};
+	_listeners = /* @__PURE__ */ new Set();
+	_chunkListeners = /* @__PURE__ */ new Set();
+	_rawMessageListeners = /* @__PURE__ */ new Set();
+	_ackTimer = null;
+	_livenessTimer = null;
+	_queryRetryTimer = null;
+	_lastServerAt = 0;
+	_subscribed = false;
+	_disposed = false;
+	/** Known providers by id — updated live via `provider:announce` + `provider:gone`. */
+	_providers = /* @__PURE__ */ new Map();
+	constructor(options) {
+		this.id = generateUuid();
+		this._features = [...options.features];
+		if (options.onChange) this._listeners.add(options.onChange);
+		this._discoveryBus = new BroadcastChannel(options.discoveryChannelName ?? DISCOVERY_CHANNEL);
+		const mkSeries = () => ({
+			data: new Float32Array(CLIENT_SERIES_SIZE),
+			write: 0,
+			length: 0
+		});
+		this.state = {
+			series: {
+				fps: mkSeries(),
+				cpuMs: mkSeries(),
+				gpuMs: mkSeries(),
+				heapUsedMB: mkSeries(),
+				drawCalls: mkSeries(),
+				triangles: mkSeries(),
+				primitives: mkSeries(),
+				geometries: mkSeries(),
+				textures: mkSeries(),
+				frames: {
+					data: new Uint32Array(CLIENT_SERIES_SIZE),
+					write: 0,
+					length: 0
+				}
+			},
+			registry: /* @__PURE__ */ new Map(),
+			buffers: /* @__PURE__ */ new Map(),
+			batches: {
+				frame: 0,
+				passes: [],
+				batches: []
+			},
+			providers: [],
+			selectedProviderId: null,
+			serverAlive: false,
+			serverLagMs: 0
+		};
+		this._discoveryBus.addEventListener("message", (ev) => {
+			this._onDiscoveryMessage(ev.data);
+		});
+	}
+	/**
+	* Begin discovery + subscription. Sends a `provider:query`, waits
+	* `DISCOVERY_WINDOW_MS` for `provider:announce` responses, then picks
+	* the best provider (user > system) and subscribes to it.
+	*
+	* Idempotent — calling again while already started is a no-op.
+	*/
+	start() {
+		if (this._disposed || this._subscribed) return;
+		this._subscribed = true;
+		this._sendQuery();
+		let retries = 0;
+		let nextDelay = QUERY_RETRY_MIN_MS;
+		const tick = () => {
+			if (this._disposed || this.state.selectedProviderId !== null) {
+				this._queryRetryTimer = null;
+				return;
+			}
+			if (retries >= QUERY_MAX_RETRIES) {
+				this._queryRetryTimer = null;
+				return;
+			}
+			retries++;
+			this._sendQuery();
+			nextDelay = Math.min(nextDelay * 2, QUERY_RETRY_MAX_MS);
+			this._queryRetryTimer = setTimeout(tick, nextDelay);
+		};
+		this._queryRetryTimer = setTimeout(tick, nextDelay);
+		this._livenessTimer = setInterval(() => this._checkLiveness(), 1e3);
+	}
+	_sendQuery() {
+		this._postDiscovery({
+			type: "provider:query",
+			payload: { requesterId: this.id }
+		});
+	}
+	/**
+	* Update the feature set. Re-posts `subscribe` on the current
+	* provider's data channel.
+	*/
+	setFeatures(features) {
+		if (sameSet(this._features, features)) return;
+		this._features = [...features];
+		this._resubscribe();
+	}
+	/**
+	* Update the registry entry filter. Pass `null` for "every entry",
+	* `[]` to stop all registry traffic, or a list of names to narrow.
+	* Re-posts `subscribe` if the filter actually changed.
+	*/
+	/**
+	* Narrow which registry entries the provider should ship samples
+	* for. `null` = all entries; `[]` = none; `[name, …]` = only these.
+	* Metadata still flows regardless — only sample bytes are gated.
+	*/
+	setRegistry(names) {
+		if (sameFilter(this._registrySelection, names)) return;
+		this._registrySelection = names === null ? null : [...names];
+		this._resubscribe();
+	}
+	/**
+	* Update the buffer subscription. Map of entry-name → (mode, thumbSize?).
+	*   - Empty map / missing names → metadata-only (provider sends no pixels,
+	*     runs no readbacks). This is the idle state when no preview or
+	*     modal is visible.
+	*   - `{ name: { mode: 'thumbnail', thumbSize: 256 } }` → small
+	*     downsampled preview. Use when a thumbnail card is visible.
+	*   - `{ name: { mode: 'stream' } }` → full-size VP9 video stream.
+	*     Use when the fullscreen modal is open.
+	*
+	* Mode changes (incl. unsubscribing) take effect on the next
+	* provider flush; the producer will drop old readbacks immediately.
+	*/
+	setBuffers(subscription) {
+		if (sameBufferSubscription(this._buffersSelection, subscription)) return;
+		this._buffersSelection = { ...subscription };
+		this._resubscribe();
+	}
+	_resubscribe() {
+		if (this._subscribed && this._dataBus !== null) {
+			const hasBuffers = Object.keys(this._buffersSelection).length > 0;
+			this._postData({
+				type: "subscribe",
+				payload: {
+					id: this.id,
+					features: this._features,
+					registry: this._registrySelection ?? void 0,
+					buffers: hasBuffers ? this._buffersSelection : void 0
+				}
+			});
+		}
+	}
+	/**
+	* Manually switch to a different provider. No-op if unknown or if
+	* already selected. Closes the old data channel and opens the new one.
+	*/
+	selectProvider(providerId) {
+		if (!this._providers.has(providerId)) return;
+		if (this.state.selectedProviderId === providerId) return;
+		this._leaveDataChannel();
+		this.state.selectedProviderId = providerId;
+		this._resetAccumulatedState();
+		this._joinDataChannel(providerId);
+		this._postData({
+			type: "subscribe",
+			payload: {
+				id: this.id,
+				features: this._features,
+				registry: this._registrySelection ?? void 0,
+				buffers: Object.keys(this._buffersSelection).length > 0 ? this._buffersSelection : void 0
+			}
+		});
+		this._fire();
+	}
+	dispose() {
+		if (this._disposed) return;
+		this._disposed = true;
+		this._leaveDataChannel();
+		this._subscribed = false;
+		if (this._ackTimer !== null) {
+			clearInterval(this._ackTimer);
+			this._ackTimer = null;
+		}
+		if (this._livenessTimer !== null) {
+			clearInterval(this._livenessTimer);
+			this._livenessTimer = null;
+		}
+		if (this._queryRetryTimer !== null) {
+			clearTimeout(this._queryRetryTimer);
+			this._queryRetryTimer = null;
+		}
+		try {
+			this._discoveryBus.close();
+		} catch {}
+	}
+	/**
+	* Open a fresh per-provider data channel and start listening on it.
+	* Caller is responsible for posting the initial `subscribe`.
+	*/
+	_joinDataChannel(providerId) {
+		this._dataBus = new BroadcastChannel(providerChannelName(providerId));
+		this._dataHandler = (ev) => {
+			this._onDataMessage(ev.data);
+		};
+		this._dataBus.addEventListener("message", this._dataHandler);
+	}
+	/**
+	* Send `unsubscribe` (if we have someone to tell) and close the data
+	* channel. Idempotent — safe to call when there's no active channel.
+	*/
+	_leaveDataChannel() {
+		if (this._dataBus !== null) {
+			if (this._subscribed) try {
+				this._postData({
+					type: "unsubscribe",
+					payload: { id: this.id }
+				});
+			} catch {}
+			if (this._dataHandler !== null) try {
+				this._dataBus.removeEventListener("message", this._dataHandler);
+			} catch {}
+			try {
+				this._dataBus.close();
+			} catch {}
+			this._dataBus = null;
+			this._dataHandler = null;
+		}
+	}
+	/**
+	* Handler for the shared discovery bus. Only discovery messages land
+	* here by protocol; anything else is ignored.
+	*/
+	_onDiscoveryMessage(msg) {
+		if (!msg || typeof msg !== "object" || !("type" in msg)) return;
+		tracePerf(msg);
+		switch (msg.type) {
+			case "provider:announce": {
+				const id = msg.payload.identity.id;
+				this._providers.set(id, msg.payload.identity);
+				this.state.providers = Array.from(this._providers.values());
+				this._fire();
+				if (this.state.selectedProviderId === null) this._pickProviderAndSubscribe();
+				break;
+			}
+			case "provider:gone": {
+				const id = msg.payload.id;
+				if (!this._providers.has(id)) return;
+				this._providers.delete(id);
+				this.state.providers = Array.from(this._providers.values());
+				if (this.state.selectedProviderId === id) {
+					this._leaveDataChannel();
+					this.state.selectedProviderId = null;
+					this._resetAccumulatedState();
+					this._pickProviderAndSubscribe();
+				}
+				this._fire();
+				break;
+			}
+			default: break;
+		}
+	}
+	/**
+	* Handler for the per-provider data channel. Everything here is
+	* already implicitly addressed to us (we opened the channel with the
+	* provider's id), so no per-message filtering is required beyond
+	* matching our consumer `id` on `subscribe:ack`.
+	*/
+	_onDataMessage(msg) {
+		if (!msg || typeof msg !== "object" || !("type" in msg)) return;
+		tracePerf(msg);
+		if (this._rawMessageListeners.size > 0) for (const cb of this._rawMessageListeners) try {
+			cb(msg, "in");
+		} catch {}
+		switch (msg.type) {
+			case "subscribe:ack":
+				if (msg.payload.id !== this.id) return;
+				this._markServerAlive();
+				this._applyEnv(msg.payload.env);
+				if (this._ackTimer === null) this._ackTimer = setInterval(() => this._sendAck(), ACK_INTERVAL_MS);
+				this._fire();
+				break;
+			case "data": {
+				this._markServerAlive();
+				this.state.frame = msg.payload.frame;
+				const features = msg.payload.features;
+				if (features.stats !== void 0) this._applyStats(features.stats, msg.payload.frame);
+				if (features.env !== void 0) this._applyEnv(features.env);
+				if (features.registry !== void 0) this._applyRegistry(features.registry);
+				if (features.buffers !== void 0) this._applyBuffers(features.buffers);
+				if (features.batches !== void 0) this._applyBatches(features.batches);
+				this._fire();
+				break;
+			}
+			case "buffer:chunk": {
+				this._markServerAlive();
+				const payload = msg.payload;
+				for (const cb of this._chunkListeners) try {
+					cb(payload);
+				} catch {}
+				break;
+			}
+			case "buffer:raw": {
+				this._markServerAlive();
+				const payload = msg.payload;
+				let snap = this.state.buffers.get(payload.name);
+				if (snap !== void 0) {
+					snap.pixels = new Uint8Array(payload.data);
+					snap.width = payload.width;
+					snap.height = payload.height;
+					snap.version++;
+				} else {
+					snap = {
+						name: payload.name,
+						width: payload.width,
+						height: payload.height,
+						srcWidth: payload.width,
+						srcHeight: payload.height,
+						pixelType: "rgba8",
+						display: "colors",
+						version: 0,
+						pixels: new Uint8Array(payload.data)
+					};
+					this.state.buffers.set(payload.name, snap);
+				}
+				this._fire();
+				break;
+			}
+			case "ping":
+				this._markServerAlive();
+				break;
+			default: break;
+		}
+	}
+	_markServerAlive() {
+		this._lastServerAt = Date.now();
+		if (!this.state.serverAlive) {
+			this.state.serverAlive = true;
+			this._fire();
+		}
+	}
+	/**
+	* Pick the best provider from the currently-known set and subscribe
+	* to it. Preference: `user` over `system`; first-announced as
+	* tiebreak. No-op if zero providers are known (we'll stay waiting;
+	* any future `provider:announce` that arrives doesn't auto-trigger
+	* this — call it again or restart discovery).
+	*/
+	_pickProviderAndSubscribe() {
+		if (this.state.selectedProviderId !== null) return;
+		const providers = Array.from(this._providers.values());
+		if (providers.length === 0) return;
+		const chosen = providers.find((p) => p.kind === "user") ?? providers[0];
+		this.state.selectedProviderId = chosen.id;
+		this._joinDataChannel(chosen.id);
+		this._postData({
+			type: "subscribe",
+			payload: {
+				id: this.id,
+				features: this._features,
+				registry: this._registrySelection ?? void 0,
+				buffers: Object.keys(this._buffersSelection).length > 0 ? this._buffersSelection : void 0
+			}
+		});
+		this._fire();
+	}
+	/** Clear all feature-derived state so the next data packet can start fresh. */
+	_resetAccumulatedState() {
+		this.state.frame = void 0;
+		this._applyStats(null);
+		this._applyEnv(null);
+		this.state.registry.clear();
+		this.state.buffers.clear();
+		this._applyBatches(null);
+	}
+	/**
+	* Apply a stats batch. Null = reset (feature cleared / provider gone).
+	* Otherwise: decode each typed array onto the matching Float32 ring
+	* and update the scalar with the batch mean (natural smoothing for
+	* the text label).
+	*/
+	_applyStats(batch, batchFrame = 0) {
+		if (batch === null) {
+			this.state.drawCalls = void 0;
+			this.state.triangles = void 0;
+			this.state.primitives = void 0;
+			this.state.geometries = void 0;
+			this.state.textures = void 0;
+			this.state.cpuMs = void 0;
+			this.state.fps = void 0;
+			this.state.gpuMs = void 0;
+			this.state.heapUsedMB = void 0;
+			this.state.heapLimitMB = void 0;
+			const s = this.state.series;
+			s.fps.write = 0;
+			s.fps.length = 0;
+			s.cpuMs.write = 0;
+			s.cpuMs.length = 0;
+			s.gpuMs.write = 0;
+			s.gpuMs.length = 0;
+			s.heapUsedMB.write = 0;
+			s.heapUsedMB.length = 0;
+			s.drawCalls.write = 0;
+			s.drawCalls.length = 0;
+			s.triangles.write = 0;
+			s.triangles.length = 0;
+			s.primitives.write = 0;
+			s.primitives.length = 0;
+			s.geometries.write = 0;
+			s.geometries.length = 0;
+			s.textures.write = 0;
+			s.textures.length = 0;
+			s.frames.write = 0;
+			s.frames.length = 0;
+			return;
+		}
+		const count = batch.count;
+		if (count <= 0) return;
+		const s = this.state.series;
+		{
+			const ring = s.frames;
+			const size = ring.data.length;
+			let w = ring.write;
+			for (let i = 0; i < count; i++) {
+				ring.data[w] = Math.max(0, batchFrame - count + 1 + i);
+				w = (w + 1) % size;
+			}
+			ring.write = w;
+			ring.length = Math.min(size, ring.length + count);
+		}
+		if (batch.fps) this.state.fps = this._ingestI16(s.fps, batch.fps, count, .1);
+		if (batch.cpuMs) this.state.cpuMs = this._ingestU16(s.cpuMs, batch.cpuMs, count, .01);
+		if (batch.gpuMs) this.state.gpuMs = this._ingestU16(s.gpuMs, batch.gpuMs, count, .01);
+		if (batch.heapUsedMB) this.state.heapUsedMB = this._ingestU16(s.heapUsedMB, batch.heapUsedMB, count, 1);
+		if (batch.drawCalls) this.state.drawCalls = this._ingestU32(s.drawCalls, batch.drawCalls, count);
+		if (batch.triangles) this.state.triangles = this._ingestU32(s.triangles, batch.triangles, count);
+		if (batch.primitives) this.state.primitives = this._ingestU32(s.primitives, batch.primitives, count);
+		if (batch.geometries) this.state.geometries = this._ingestU32(s.geometries, batch.geometries, count);
+		if (batch.textures) this.state.textures = this._ingestU32(s.textures, batch.textures, count);
+		if (batch.heapLimitMB !== void 0) this.state.heapLimitMB = batch.heapLimitMB;
+	}
+	/**
+	* Append `count` samples from a scaled integer view to a Float32 ring;
+	* return the batch mean (scaled). Zero-alloc past the ring itself.
+	*/
+	_ingestI16(ring, src, count, scale) {
+		const size = ring.data.length;
+		let sum = 0;
+		let w = ring.write;
+		for (let i = 0; i < count; i++) {
+			const v = src[i] * scale;
+			ring.data[w] = v;
+			sum += v;
+			w = (w + 1) % size;
+		}
+		ring.write = w;
+		ring.length = Math.min(size, ring.length + count);
+		return sum / count;
+	}
+	_ingestU16(ring, src, count, scale) {
+		const size = ring.data.length;
+		let sum = 0;
+		let w = ring.write;
+		for (let i = 0; i < count; i++) {
+			const v = src[i] * scale;
+			ring.data[w] = v;
+			sum += v;
+			w = (w + 1) % size;
+		}
+		ring.write = w;
+		ring.length = Math.min(size, ring.length + count);
+		return sum / count;
+	}
+	_ingestU32(ring, src, count) {
+		const size = ring.data.length;
+		let sum = 0;
+		let w = ring.write;
+		for (let i = 0; i < count; i++) {
+			const v = src[i];
+			ring.data[w] = v;
+			sum += v;
+			w = (w + 1) % size;
+		}
+		ring.write = w;
+		ring.length = Math.min(size, ring.length + count);
+		return sum / count;
+	}
+	/**
+	* Apply a batches feature payload — replaces the snapshot wholesale.
+	* The wire arrays are scratch pools on the producer; we truncate by
+	* the provided counts and copy fields into persistent snapshot
+	* objects the UI can hold across subsequent frames.
+	*
+	* The client-side snapshot arrays grow monotonically to the high
+	* watermark and entries are overwritten in place — same alloc
+	* discipline as the producer.
+	*/
+	_applyBatches(delta) {
+		if (delta === null) {
+			this.state.batches.frame = 0;
+			this.state.batches.passes.length = 0;
+			this.state.batches.batches.length = 0;
+			return;
+		}
+		this.state.batches.frame = delta.frame;
+		const passesIn = delta.passes;
+		const passCount = delta.passCount | 0;
+		const passesOut = this.state.batches.passes;
+		if (passesIn !== void 0) for (let i = 0; i < passCount; i++) {
+			const src = passesIn[i];
+			if (src === void 0) continue;
+			let dst = passesOut[i];
+			if (dst === void 0) {
+				dst = {
+					label: "",
+					calls: 0,
+					triangles: 0,
+					cpuMs: 0,
+					depth: 0,
+					parent: -1
+				};
+				passesOut[i] = dst;
+			}
+			dst.label = src.label;
+			dst.calls = src.calls;
+			dst.triangles = src.triangles;
+			dst.cpuMs = src.cpuMs;
+			dst.depth = src.depth;
+			dst.parent = src.parent;
+		}
+		if (passesOut.length > passCount) passesOut.length = passCount;
+		const batchesIn = delta.batches;
+		const batchCount = delta.batchCount | 0;
+		const batchesOut = this.state.batches.batches;
+		if (batchesIn !== void 0) for (let i = 0; i < batchCount; i++) {
+			const src = batchesIn[i];
+			if (src === void 0) continue;
+			let dst = batchesOut[i];
+			if (dst === void 0) {
+				dst = {
+					runKey: 0,
+					materialId: 0,
+					layer: 0,
+					materialName: "",
+					spriteCount: 0,
+					batchIdx: 0,
+					kind: "sprite",
+					label: ""
+				};
+				batchesOut[i] = dst;
+			}
+			dst.runKey = src.runKey;
+			dst.materialId = src.materialId;
+			dst.layer = src.layer;
+			dst.materialName = src.materialName;
+			dst.spriteCount = src.spriteCount;
+			dst.batchIdx = src.batchIdx;
+			dst.kind = src.kind ?? "sprite";
+			dst.label = src.label ?? "";
+		}
+		if (batchesOut.length > batchCount) batchesOut.length = batchCount;
+	}
+	/**
+	* Apply a registry delta. `entries[name] === null` → remove;
+	* `entries[name]` present → upsert a snapshot keyed by `name`.
+	* A `null` batch (feature cleared) drops every entry.
+	*/
+	_applyRegistry(delta) {
+		if (delta === null) {
+			this.state.registry.clear();
+			return;
+		}
+		if (!delta.entries) return;
+		const entries = delta.entries;
+		for (const name in entries) {
+			const d = entries[name];
+			if (d === void 0) continue;
+			if (d === null) {
+				this.state.registry.delete(name);
+				continue;
+			}
+			let snap = this.state.registry.get(name);
+			const sample = d.sample ?? snap?.sample ?? EMPTY_SAMPLE;
+			if (snap === void 0) {
+				snap = {
+					name,
+					kind: d.kind,
+					version: d.version,
+					count: d.count,
+					sample,
+					label: d.label
+				};
+				this.state.registry.set(name, snap);
+			} else {
+				snap.kind = d.kind;
+				snap.version = d.version;
+				snap.count = d.count;
+				snap.sample = sample;
+				snap.label = d.label;
+			}
+		}
+	}
+	/**
+	* Apply a buffers delta. Metadata (width/height/version/pixelType)
+	* ships regardless of the client's selection; `pixels` only arrives
+	* when this entry is in the current selection. Retain the previous
+	* `pixels` when the delta is metadata-only so the UI keeps showing
+	* the last thumbnail while browsing.
+	*/
+	_applyBuffers(delta) {
+		if (delta === null) {
+			this.state.buffers.clear();
+			return;
+		}
+		if (!delta.entries) return;
+		const entries = delta.entries;
+		for (const name in entries) {
+			const d = entries[name];
+			if (d === void 0) continue;
+			if (d === null) {
+				this.state.buffers.delete(name);
+				continue;
+			}
+			let snap = this.state.buffers.get(name);
+			const pixels = d.pixels ?? snap?.pixels ?? null;
+			const isFloat = d.pixelType === "rgba16f" || d.pixelType === "rgba32f";
+			const display = d.display ?? (isFloat ? "normalize" : "colors");
+			const srcW = d.srcWidth ?? d.width;
+			const srcH = d.srcHeight ?? d.height;
+			if (snap === void 0) {
+				snap = {
+					name,
+					width: d.width,
+					height: d.height,
+					srcWidth: srcW,
+					srcHeight: srcH,
+					pixelType: d.pixelType,
+					display,
+					version: d.version,
+					pixels,
+					label: d.label
+				};
+				this.state.buffers.set(name, snap);
+			} else {
+				snap.width = d.width;
+				snap.height = d.height;
+				snap.srcWidth = srcW;
+				snap.srcHeight = srcH;
+				snap.pixelType = d.pixelType;
+				snap.display = display;
+				snap.version = d.version;
+				snap.pixels = pixels;
+				snap.label = d.label;
+			}
+		}
+	}
+	_applyEnv(delta) {
+		if (delta === null) {
+			this.state.threeFlatlandVersion = void 0;
+			this.state.threeRevision = void 0;
+			this.state.backendName = void 0;
+			this.state.backendTrackTimestamp = void 0;
+			this.state.backendDisjoint = void 0;
+			this.state.gpuModeEnabled = void 0;
+			this.state.canvasWidth = void 0;
+			this.state.canvasHeight = void 0;
+			this.state.canvasPixelRatio = void 0;
+			return;
+		}
+		if ("threeFlatlandVersion" in delta) this.state.threeFlatlandVersion = delta.threeFlatlandVersion ?? void 0;
+		if ("threeRevision" in delta) this.state.threeRevision = delta.threeRevision ?? void 0;
+		if (delta.backend !== void 0) {
+			const b = delta.backend;
+			if (b === null) {
+				this.state.backendName = void 0;
+				this.state.backendTrackTimestamp = void 0;
+				this.state.backendDisjoint = void 0;
+				this.state.gpuModeEnabled = void 0;
+			} else {
+				if ("name" in b) this.state.backendName = b.name ?? void 0;
+				if ("trackTimestamp" in b) this.state.backendTrackTimestamp = b.trackTimestamp ?? void 0;
+				if ("disjoint" in b) this.state.backendDisjoint = b.disjoint ?? void 0;
+				if ("gpuModeEnabled" in b) this.state.gpuModeEnabled = b.gpuModeEnabled ?? void 0;
+			}
+		}
+		if (delta.canvas !== void 0) {
+			const c = delta.canvas;
+			if (c === null) {
+				this.state.canvasWidth = void 0;
+				this.state.canvasHeight = void 0;
+				this.state.canvasPixelRatio = void 0;
+			} else {
+				if ("width" in c) this.state.canvasWidth = c.width ?? void 0;
+				if ("height" in c) this.state.canvasHeight = c.height ?? void 0;
+				if ("pixelRatio" in c) this.state.canvasPixelRatio = c.pixelRatio ?? void 0;
+			}
+		}
+	}
+	_checkLiveness() {
+		const now = Date.now();
+		const lag = this._lastServerAt === 0 ? now : now - this._lastServerAt;
+		this.state.serverLagMs = lag;
+		if (this._lastServerAt !== 0 && lag > SERVER_LIVENESS_MS) {
+			if (this.state.serverAlive) this.state.serverAlive = false;
+			if (this._dataBus !== null) this._postData({
+				type: "subscribe",
+				payload: {
+					id: this.id,
+					features: this._features,
+					registry: this._registrySelection ?? void 0,
+					buffers: Object.keys(this._buffersSelection).length > 0 ? this._buffersSelection : void 0
+				}
+			});
+		}
+		this._fire();
+	}
+	_sendAck() {
+		if (this._disposed || this._dataBus === null) return;
+		this._postData({
+			type: "ack",
+			payload: { id: this.id }
+		});
+	}
+	_postDiscovery(body) {
+		const msg = {
+			v: DEBUG_PROTOCOL_VERSION,
+			ts: Date.now(),
+			...body
+		};
+		this._fireRawMessage(msg, "out");
+		try {
+			this._discoveryBus.postMessage(msg);
+		} catch {}
+	}
+	_postData(body) {
+		if (this._dataBus === null) return;
+		const msg = {
+			v: DEBUG_PROTOCOL_VERSION,
+			ts: Date.now(),
+			...body
+		};
+		this._fireRawMessage(msg, "out");
+		try {
+			this._dataBus.postMessage(msg);
+		} catch {}
+	}
+	_fireRawMessage(msg, direction) {
+		if (this._rawMessageListeners.size === 0) return;
+		for (const cb of this._rawMessageListeners) try {
+			cb(msg, direction);
+		} catch {}
+	}
+	/** Subscribe to state-change events. Returns an unsubscribe function. */
+	addListener(cb) {
+		this._listeners.add(cb);
+		return () => {
+			this._listeners.delete(cb);
+		};
+	}
+	/** Explicit remove — equivalent to calling the unsubscribe returned from `addListener`. */
+	removeListener(cb) {
+		this._listeners.delete(cb);
+	}
+	/** Subscribe to incoming WebCodecs buffer chunks. Returns an unsubscribe function. */
+	addChunkListener(cb) {
+		this._chunkListeners.add(cb);
+		return () => {
+			this._chunkListeners.delete(cb);
+		};
+	}
+	/**
+	* Subscribe to every bus message — both inbound (from providers) and
+	* outbound (our own `subscribe`/`ack`/etc.). Used by the dashboard's
+	* protocol-log panel. Listeners fire on the hot path so keep them
+	* cheap — filter and format lazily.
+	*/
+	addRawMessageListener(cb) {
+		this._rawMessageListeners.add(cb);
+		return () => {
+			this._rawMessageListeners.delete(cb);
+		};
+	}
+	_fire() {
+		for (const cb of this._listeners) try {
+			cb(this.state);
+		} catch {}
+	}
+};
+/** Cheap equality for two small feature lists treated as sets. */
 function sameSet(a, b) {
-  if (a.length !== b.length) return false;
-  for (const v of a) if (!b.includes(v)) return false;
-  return true;
+	if (a.length !== b.length) return false;
+	for (const v of a) if (!b.includes(v)) return false;
+	return true;
 }
+/** Equality for registry filters (where `null` has a distinct meaning). */
 function sameFilter(a, b) {
-  if (a === b) return true;
-  if (a === null || b === null) return false;
-  return sameSet(a, b);
+	if (a === b) return true;
+	if (a === null || b === null) return false;
+	return sameSet(a, b);
 }
+/** Equality for buffer subscription records. Compares keys and nested fields. */
 function sameBufferSubscription(a, b) {
-  const ak = Object.keys(a);
-  const bk = Object.keys(b);
-  if (ak.length !== bk.length) return false;
-  for (const k of ak) {
-    const av = a[k];
-    const bv = b[k];
-    if (av === void 0 || bv === void 0) return false;
-    if (av.mode !== bv.mode) return false;
-    if ((av.thumbSize ?? 256) !== (bv.thumbSize ?? 256)) return false;
-  }
-  return true;
+	const ak = Object.keys(a);
+	const bk = Object.keys(b);
+	if (ak.length !== bk.length) return false;
+	for (const k of ak) {
+		const av = a[k];
+		const bv = b[k];
+		if (av === void 0 || bv === void 0) return false;
+		if (av.mode !== bv.mode) return false;
+		if ((av.thumbSize ?? 256) !== (bv.thumbSize ?? 256)) return false;
+	}
+	return true;
 }
 function generateUuid() {
-  const c = typeof crypto !== "undefined" ? crypto : void 0;
-  if (c && typeof c.randomUUID === "function") return c.randomUUID();
-  const bytes = new Uint8Array(16);
-  if (c && typeof c.getRandomValues === "function") c.getRandomValues(bytes);
-  else for (let i = 0; i < 16; i++) bytes[i] = Math.floor(Math.random() * 256);
-  bytes[6] = bytes[6] & 15 | 64;
-  bytes[8] = bytes[8] & 63 | 128;
-  const h = Array.from(bytes, (b) => b.toString(16).padStart(2, "0"));
-  return `${h.slice(0, 4).join("")}-${h.slice(4, 6).join("")}-${h.slice(6, 8).join("")}-${h.slice(8, 10).join("")}-${h.slice(10).join("")}`;
+	const c = typeof crypto !== "undefined" ? crypto : void 0;
+	if (c && typeof c.randomUUID === "function") return c.randomUUID();
+	const bytes = /* @__PURE__ */ new Uint8Array(16);
+	if (c && typeof c.getRandomValues === "function") c.getRandomValues(bytes);
+	else for (let i = 0; i < 16; i++) bytes[i] = Math.floor(Math.random() * 256);
+	bytes[6] = bytes[6] & 15 | 64;
+	bytes[8] = bytes[8] & 63 | 128;
+	const h = Array.from(bytes, (b) => b.toString(16).padStart(2, "0"));
+	return `${h.slice(0, 4).join("")}-${h.slice(4, 6).join("")}-${h.slice(6, 8).join("")}-${h.slice(8, 10).join("")}-${h.slice(10).join("")}`;
 }
-export {
-  DevtoolsClient
-};
+//#endregion
+export { DevtoolsClient };
+
 //# sourceMappingURL=devtools-client.js.map