@vscode/component-explorer 0.1.1-11 → 0.1.1-13

package/dist/viewer.js

@@ -1,35 +1,35 @@
-var St = Object.defineProperty;
-var wt = (s, e, t) => e in s ? St(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t;
-var l = (s, e, t) => wt(s, typeof e != "symbol" ? e + "" : e, t);
-import { fixtureGroupBrand as ke, fixtureVariantsBrand as Ve, singleFixtureBrand as Ne } from "./index.js";
-import { defineFixture as Hs, defineFixtureGroup as Ls, defineFixtureVariants as Us } from "./index.js";
-import { createRoot as It } from "react-dom/client";
-import { createContext as Je, useReducer as Ot, useState as Rt, useContext as Tt, useEffect as De, createElement as kt } from "react";
-import { jsx as a, jsxs as f, Fragment as ye } from "react/jsx-runtime";
-import { unstable_batchedUpdates as Ze } from "react-dom";
-function xe(s) {
-  return typeof s == "object" && s !== null && Ne in s && s[Ne] === !0 && "_options" in s && typeof s._options == "object";
-}
-function Ce(s) {
-  return typeof s == "object" && s !== null && ke in s && s[ke] === !0 && "_entries" in s && typeof s._entries == "object";
-}
-function Se(s) {
-  return typeof s == "object" && s !== null && Ve in s && s[Ve] === !0 && "_variants" in s && typeof s._variants == "object";
-}
-function Ns(s) {
-  return xe(s) ? { success: !0, data: s } : Ce(s) ? { success: !0, data: s } : Se(s) ? { success: !0, data: s } : { success: !1, error: "Value is not a valid fixture export (missing brand symbol or _options/_entries/_variants)" };
-}
-function Ds(s) {
-  return xe(s) ? { success: !0, data: s } : { success: !1, error: "Value is not a SingleFixtureExport" };
-}
-function Ms(s) {
-  return Ce(s) ? { success: !0, data: s } : { success: !1, error: "Value is not a FixtureGroupExport" };
-}
-function Fs(s) {
-  return Se(s) ? { success: !0, data: s } : { success: !1, error: "Value is not a FixtureVariantsExport" };
-}
-function Me(s, e, t) {
-  const n = s._options;
+var mt = Object.defineProperty;
+var vt = (r, e, t) => e in r ? mt(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t;
+var l = (r, e, t) => vt(r, typeof e != "symbol" ? e + "" : e, t);
+import { f as we, a as Re, s as Te } from "./index-DnRcKk60.js";
+import { b as Dn, d as Fn, c as En, e as Bn, g as An } from "./index-DnRcKk60.js";
+import { createRoot as _t } from "react-dom/client";
+import { createContext as Pe, useReducer as bt, useState as yt, useContext as xt, useEffect as Ie, createElement as Ct } from "react";
+import { jsx as a, jsxs as p, Fragment as ge } from "react/jsx-runtime";
+import { unstable_batchedUpdates as We } from "react-dom";
+function me(r) {
+  return typeof r == "object" && r !== null && Te in r && r[Te] === !0 && "_options" in r && typeof r._options == "object";
+}
+function ve(r) {
+  return typeof r == "object" && r !== null && we in r && r[we] === !0 && "_entries" in r && typeof r._entries == "object";
+}
+function _e(r) {
+  return typeof r == "object" && r !== null && Re in r && r[Re] === !0 && "_variants" in r && typeof r._variants == "object";
+}
+function wn(r) {
+  return me(r) ? { success: !0, data: r } : ve(r) ? { success: !0, data: r } : _e(r) ? { success: !0, data: r } : { success: !1, error: "Value is not a valid fixture export (missing brand symbol or _options/_entries/_variants)" };
+}
+function Rn(r) {
+  return me(r) ? { success: !0, data: r } : { success: !1, error: "Value is not a SingleFixtureExport" };
+}
+function Tn(r) {
+  return ve(r) ? { success: !0, data: r } : { success: !1, error: "Value is not a FixtureGroupExport" };
+}
+function In(r) {
+  return _e(r) ? { success: !0, data: r } : { success: !1, error: "Value is not a FixtureVariantsExport" };
+}
+function Oe(r, e, t) {
+  const n = r._options;
   return {
     id: e,
     name: t,
@@ -42,115 +42,115 @@ function Me(s, e, t) {
     render: n.render
   };
 }
-function Es(s) {
-  return typeof s == "object" && s !== null && "render" in s && typeof s.render == "function" && "id" in s && "name" in s;
+function On(r) {
+  return typeof r == "object" && r !== null && "render" in r && typeof r.render == "function" && "id" in r && "name" in r;
 }
-const Vt = {
+const St = {
   mobile: { width: 390, height: 844 },
   tablet: { width: 768, height: 1024 },
   desktop: { width: 1440, height: 900 }
 };
-function Nt(s) {
-  return typeof s == "string" ? { name: s, ...Vt[s] } : s;
+function wt(r) {
+  return typeof r == "string" ? { name: r, ...St[r] } : r;
 }
-function Dt(s) {
+function Rt(r) {
   const e = {};
-  for (const t of s)
+  for (const t of r)
     e[t.name] = t.defaultValue;
   return e;
 }
-function le(s) {
+function ie(r) {
   const e = {
     id: "",
     name: "Components",
     type: "folder",
     children: []
   };
-  for (const [t, n] of s) {
-    const r = Mt(t);
-    Xe(e, [r], n);
+  for (const [t, n] of r) {
+    const s = Tt(t);
+    Ge(e, [s], n);
   }
   return e;
 }
-function Mt(s) {
-  return (s.split("/").pop() ?? s).replace(/\.fixture\.(tsx?|jsx?)$/, "");
+function Tt(r) {
+  return (r.split("/").pop() ?? r).replace(/\.fixture\.(tsx?|jsx?)$/, "");
 }
-function Xe(s, e, t) {
+function Ge(r, e, t) {
   var n;
-  if (xe(t)) {
-    const r = e.join("/"), i = e[e.length - 1], o = {
-      id: r,
-      name: i,
+  if (me(t)) {
+    const s = e.join("/"), o = e[e.length - 1], i = {
+      id: s,
+      name: o,
       type: "component",
-      component: Me(t, r, i)
+      component: Oe(t, s, o)
     };
-    s.children || (s.children = []), s.children.push(o);
-  } else if (Ce(t)) {
-    const r = e[e.length - 1], i = e.join("/");
-    let o = (n = s.children) == null ? void 0 : n.find(
-      (d) => d.type === "folder" && d.name === r
+    r.children || (r.children = []), r.children.push(i);
+  } else if (ve(t)) {
+    const s = e[e.length - 1], o = e.join("/");
+    let i = (n = r.children) == null ? void 0 : n.find(
+      (d) => d.type === "folder" && d.name === s
     );
-    o || (o = {
-      id: i,
-      name: r,
+    i || (i = {
+      id: o,
+      name: s,
       type: "folder",
       children: []
-    }, s.children || (s.children = []), s.children.push(o));
+    }, r.children || (r.children = []), r.children.push(i));
     for (const [d, c] of Object.entries(t._entries))
-      Xe(o, [...e, d], c);
-  } else if (Se(t)) {
-    const r = e[e.length - 1], o = {
+      Ge(i, [...e, d], c);
+  } else if (_e(t)) {
+    const s = e[e.length - 1], i = {
       id: e.join("/"),
-      name: r,
+      name: s,
       type: "variants",
       children: []
     };
-    s.children || (s.children = []), s.children.push(o);
+    r.children || (r.children = []), r.children.push(i);
     for (const [d, c] of Object.entries(t._variants)) {
-      const m = [...e, d].join("/"), _ = {
+      const m = [...e, d].join("/"), v = {
         id: m,
         name: d,
         type: "component",
-        component: Me(c, m, d)
+        component: Oe(c, m, d)
       };
-      o.children.push(_);
+      i.children.push(v);
     }
   }
 }
-function Fe(s, e) {
+function ke(r, e) {
   if (e.length === 0)
-    return s;
-  let t = s;
+    return r;
+  let t = r;
   for (const n of e) {
     if (!t || !t.children)
       return;
-    t = t.children.find((r) => r.name === n);
+    t = t.children.find((s) => s.name === n);
   }
   return t;
 }
-function Ft(s) {
-  if (s.type === "component" && s.component)
-    return [s.component];
+function It(r) {
+  if (r.type === "component" && r.component)
+    return [r.component];
   const e = [];
-  for (const t of s.children ?? [])
-    e.push(...Ft(t));
+  for (const t of r.children ?? [])
+    e.push(...It(t));
   return e;
 }
-let j;
-function Qe(s) {
-  j ? j instanceof Ee ? j.loggers.push(s) : j = new Ee([j, s]) : j = s;
+let $;
+function Ot(r) {
+  $ ? $ instanceof Ve ? $.loggers.push(r) : $ = new Ve([$, r]) : $ = r;
 }
-function b() {
-  return j;
+function C() {
+  return $;
 }
-let he;
-function Et(s) {
-  he = s;
+let ae;
+function kt(r) {
+  ae = r;
 }
-function At(s) {
-  he && he(s);
+function Vt(r) {
+  ae && ae(r);
 }
-class Ee {
+class Ve {
   constructor(e) {
     this.loggers = e;
   }
@@ -175,8 +175,8 @@ class Ee {
       t.handleAutorunDisposed(e);
   }
   handleAutorunDependencyChanged(e, t, n) {
-    for (const r of this.loggers)
-      r.handleAutorunDependencyChanged(e, t, n);
+    for (const s of this.loggers)
+      s.handleAutorunDependencyChanged(e, t, n);
   }
   handleAutorunStarted(e) {
     for (const t of this.loggers)
@@ -187,8 +187,8 @@ class Ee {
       t.handleAutorunFinished(e);
   }
   handleDerivedDependencyChanged(e, t, n) {
-    for (const r of this.loggers)
-      r.handleDerivedDependencyChanged(e, t, n);
+    for (const s of this.loggers)
+      s.handleDerivedDependencyChanged(e, t, n);
   }
   handleDerivedCleared(e) {
     for (const t of this.loggers)
@@ -203,143 +203,143 @@ class Ee {
       t.handleEndTransaction(e);
   }
 }
-var T;
-(function(s) {
+var F;
+(function(r) {
   let e = !1;
   function t() {
     e = !0;
   }
-  s.enable = t;
+  r.enable = t;
   function n() {
-    return r(1);
+    return s(1);
   }
-  s.ofCaller = n;
-  function r(i) {
+  r.ofCaller = n;
+  function s(o) {
     if (!e)
       return;
-    const o = Error, d = o.stackTraceLimit;
-    o.stackTraceLimit = 3;
+    const i = Error, d = i.stackTraceLimit;
+    i.stackTraceLimit = 3;
     const c = new Error().stack;
-    return o.stackTraceLimit = d, we.fromStack(c, i + 1);
+    return i.stackTraceLimit = d, be.fromStack(c, o + 1);
   }
-  s.ofNthCaller = r;
-})(T || (T = {}));
-class we {
+  r.ofNthCaller = s;
+})(F || (F = {}));
+class be {
   static fromStack(e, t) {
     const n = e.split(`
-`), r = Bt(n[t + 1]);
-    if (r)
-      return new we(r.fileName, r.line, r.column, r.id);
+`), s = Nt(n[t + 1]);
+    if (s)
+      return new be(s.fileName, s.line, s.column, s.id);
   }
-  constructor(e, t, n, r) {
-    this.fileName = e, this.line = t, this.column = n, this.id = r;
+  constructor(e, t, n, s) {
+    this.fileName = e, this.line = t, this.column = n, this.id = s;
   }
 }
-function Bt(s) {
-  if (!s)
+function Nt(r) {
+  if (!r)
     return;
-  const e = s.match(/\((.*):(\d+):(\d+)\)/);
+  const e = r.match(/\((.*):(\d+):(\d+)\)/);
   if (e)
     return {
       fileName: e[1],
       line: parseInt(e[2]),
       column: parseInt(e[3]),
-      id: s
+      id: r
     };
-  const t = s.match(/at ([^\(\)]*):(\d+):(\d+)/);
+  const t = r.match(/at ([^\(\)]*):(\d+):(\d+)/);
   if (t)
     return {
       fileName: t[1],
       line: parseInt(t[2]),
       column: parseInt(t[3]),
-      id: s
+      id: r
     };
 }
-class B {
+class E {
   constructor(e, t, n) {
     this.owner = e, this.debugNameSource = t, this.referenceFn = n;
   }
   getDebugName(e) {
-    return zt(e, this);
+    return Mt(e, this);
   }
 }
-const Ae = /* @__PURE__ */ new Map(), ue = /* @__PURE__ */ new WeakMap();
-function zt(s, e) {
-  const t = ue.get(s);
+const Ne = /* @__PURE__ */ new Map(), de = /* @__PURE__ */ new WeakMap();
+function Mt(r, e) {
+  const t = de.get(r);
   if (t)
     return t;
-  const n = $t(s, e);
+  const n = Dt(r, e);
   if (n) {
-    let r = Ae.get(n) ?? 0;
-    r++, Ae.set(n, r);
-    const i = r === 1 ? n : `${n}#${r}`;
-    return ue.set(s, i), i;
+    let s = Ne.get(n) ?? 0;
+    s++, Ne.set(n, s);
+    const o = s === 1 ? n : `${n}#${s}`;
+    return de.set(r, o), o;
   }
 }
-function $t(s, e) {
-  const t = ue.get(s);
+function Dt(r, e) {
+  const t = de.get(r);
   if (t)
     return t;
-  const n = e.owner ? Lt(e.owner) + "." : "";
-  let r;
-  const i = e.debugNameSource;
-  if (i !== void 0)
-    if (typeof i == "function") {
-      if (r = i(), r !== void 0)
-        return n + r;
+  const n = e.owner ? Et(e.owner) + "." : "";
+  let s;
+  const o = e.debugNameSource;
+  if (o !== void 0)
+    if (typeof o == "function") {
+      if (s = o(), s !== void 0)
+        return n + s;
     } else
-      return n + i;
-  const o = e.referenceFn;
-  if (o !== void 0 && (r = Ie(o), r !== void 0))
-    return n + r;
+      return n + o;
+  const i = e.referenceFn;
+  if (i !== void 0 && (s = ye(i), s !== void 0))
+    return n + s;
   if (e.owner !== void 0) {
-    const d = Ht(e.owner, s);
+    const d = Ft(e.owner, r);
     if (d !== void 0)
       return n + d;
   }
 }
-function Ht(s, e) {
-  for (const t in s)
-    if (s[t] === e)
+function Ft(r, e) {
+  for (const t in r)
+    if (r[t] === e)
       return t;
 }
-const Be = /* @__PURE__ */ new Map(), ze = /* @__PURE__ */ new WeakMap();
-function Lt(s) {
-  const e = ze.get(s);
+const Me = /* @__PURE__ */ new Map(), De = /* @__PURE__ */ new WeakMap();
+function Et(r) {
+  const e = De.get(r);
   if (e)
     return e;
-  const t = Ye(s) ?? "Object";
-  let n = Be.get(t) ?? 0;
-  n++, Be.set(t, n);
-  const r = n === 1 ? t : `${t}#${n}`;
-  return ze.set(s, r), r;
-}
-function Ye(s) {
-  const e = s.constructor;
+  const t = qe(r) ?? "Object";
+  let n = Me.get(t) ?? 0;
+  n++, Me.set(t, n);
+  const s = n === 1 ? t : `${t}#${n}`;
+  return De.set(r, s), s;
+}
+function qe(r) {
+  const e = r.constructor;
   if (e)
     return e.name === "Object" ? void 0 : e.name;
 }
-function Ie(s) {
-  const e = s.toString(), n = /\/\*\*\s*@description\s*([^*]*)\*\//.exec(e), r = n ? n[1] : void 0;
-  return r == null ? void 0 : r.trim();
+function ye(r) {
+  const e = r.toString(), n = /\/\*\*\s*@description\s*([^*]*)\*\//.exec(e), s = n ? n[1] : void 0;
+  return s == null ? void 0 : s.trim();
 }
-let fe;
-function Ut(s) {
-  fe = s;
+let ce;
+function Bt(r) {
+  ce = r;
 }
-let et;
-function jt(s) {
-  et = s;
+let Ke;
+function At(r) {
+  Ke = r;
 }
-let tt;
-function Pt(s) {
-  tt = s;
+let Je;
+function zt(r) {
+  Je = r;
 }
-let nt;
-function Gt(s) {
-  nt = s;
+let Ze;
+function $t(r) {
+  Ze = r;
 }
-class Wt {
+class Lt {
   get TChange() {
     return null;
   }
@@ -350,35 +350,35 @@ class Wt {
   read(e) {
     return e ? e.readObservable(this) : this.get();
   }
-  map(e, t, n = T.ofCaller()) {
-    const r = t === void 0 ? void 0 : e, i = t === void 0 ? e : t;
-    return fe({
-      owner: r,
+  map(e, t, n = F.ofCaller()) {
+    const s = t === void 0 ? void 0 : e, o = t === void 0 ? e : t;
+    return ce({
+      owner: s,
       debugName: () => {
-        const o = Ie(i);
-        if (o !== void 0)
-          return o;
-        const c = /^\s*\(?\s*([a-zA-Z_$][a-zA-Z_$0-9]*)\s*\)?\s*=>\s*\1(?:\??)\.([a-zA-Z_$][a-zA-Z_$0-9]*)\s*$/.exec(i.toString());
+        const i = ye(o);
+        if (i !== void 0)
+          return i;
+        const c = /^\s*\(?\s*([a-zA-Z_$][a-zA-Z_$0-9]*)\s*\)?\s*=>\s*\1(?:\??)\.([a-zA-Z_$][a-zA-Z_$0-9]*)\s*$/.exec(o.toString());
         if (c)
           return `${this.debugName}.${c[2]}`;
-        if (!r)
+        if (!s)
           return `${this.debugName} (mapped)`;
       },
-      debugReferenceFn: i
-    }, (o) => i(this.read(o), o), n);
+      debugReferenceFn: o
+    }, (i) => o(this.read(i), i), n);
   }
   /**
    * @sealed
    * Converts an observable of an observable value into a direct observable of the value.
   */
   flatten() {
-    return fe({
+    return ce({
       owner: void 0,
       debugName: () => `${this.debugName} (flattened)`
     }, (e) => this.read(e).read(e));
   }
   recomputeInitiallyAndOnChange(e, t) {
-    return e.add(et(this, t)), this;
+    return e.add(Ke(this, t)), this;
   }
   /**
    * Ensures that this observable is observed. This keeps the cache alive.
@@ -386,29 +386,29 @@ class Wt {
    * Use `recomputeInitiallyAndOnChange` for eager evaluation.
    */
   keepObserved(e) {
-    return e.add(tt(this)), this;
+    return e.add(Je(this)), this;
   }
   get debugValue() {
     return this.get();
   }
   debugGetDependencyGraph() {
-    return nt(this);
+    return Ze(this);
   }
 }
-class Oe extends Wt {
+class xe extends Lt {
   constructor(e) {
     var t;
-    super(), this._observers = /* @__PURE__ */ new Set(), (t = b()) == null || t.handleObservableCreated(this, e);
+    super(), this._observers = /* @__PURE__ */ new Set(), (t = C()) == null || t.handleObservableCreated(this, e);
   }
   addObserver(e) {
     var n;
     const t = this._observers.size;
-    this._observers.add(e), t === 0 && this.onFirstObserverAdded(), t !== this._observers.size && ((n = b()) == null || n.handleOnListenerCountChanged(this, this._observers.size));
+    this._observers.add(e), t === 0 && this.onFirstObserverAdded(), t !== this._observers.size && ((n = C()) == null || n.handleOnListenerCountChanged(this, this._observers.size));
   }
   removeObserver(e) {
     var n;
     const t = this._observers.delete(e);
-    t && this._observers.size === 0 && this.onLastObserverRemoved(), t && ((n = b()) == null || n.handleOnListenerCountChanged(this, this._observers.size));
+    t && this._observers.size === 0 && this.onLastObserverRemoved(), t && ((n = C()) == null || n.handleOnListenerCountChanged(this, this._observers.size));
   }
   onFirstObserverAdded() {
   }
@@ -416,33 +416,30 @@ class Oe extends Wt {
   }
   log() {
     var t;
-    const e = !!b();
-    return At(this), e || (t = b()) == null || t.handleObservableCreated(this, T.ofCaller()), this;
+    const e = !!C();
+    return Vt(this), e || (t = C()) == null || t.handleObservableCreated(this, F.ofCaller()), this;
   }
   debugGetObservers() {
     return this._observers;
   }
 }
-function st(s) {
+function Xe(r) {
   return {
-    dispose: s
+    dispose: r
   };
 }
-class O extends Error {
+class H extends Error {
   constructor(e) {
-    super(e || "An unexpected bug occurred."), Object.setPrototypeOf(this, O.prototype);
+    super(e || "An unexpected bug occurred."), Object.setPrototypeOf(this, H.prototype);
   }
 }
-function se(s) {
-  throw s;
-}
-function pe(s) {
-  console.error("Unexpected error:", s);
+function re(r) {
+  throw r;
 }
-const Q = (s, e) => s === e;
-function ee(s) {
-  return s != null;
+function Ht(r) {
+  console.error("Unexpected error:", r);
 }
+const X = (r, e) => r === e;
 class Y {
   constructor() {
     this.disposables = [], this._isDisposed = !1;
@@ -471,8 +468,8 @@ class Y {
     this.disposables = [];
   }
 }
-function qt(s) {
-  switch (s) {
+function jt(r) {
+  switch (r) {
     case 0:
       return "initial";
     case 1:
@@ -485,17 +482,17 @@ function qt(s) {
       return "<unknown>";
   }
 }
-class w extends Oe {
+class j extends xe {
   get debugName() {
     return this._debugNameData.getDebugName(this) ?? "(anonymous)";
   }
-  constructor(e, t, n, r = void 0, i, o) {
+  constructor(e, t, n, s = void 0, o, i) {
     var d;
-    super(o), this._debugNameData = e, this._computeFn = t, this._changeTracker = n, this._handleLastObserverRemoved = r, this._equalityComparator = i, this._state = 0, this._value = void 0, this._updateCount = 0, this._dependencies = /* @__PURE__ */ new Set(), this._dependenciesToBeRemoved = /* @__PURE__ */ new Set(), this._changeSummary = void 0, this._isUpdating = !1, this._isComputing = !1, this._didReportChange = !1, this._isInBeforeUpdate = !1, this._isReaderValid = !1, this._store = void 0, this._delayedStore = void 0, this._removedObserverToCallEndUpdateOn = null, this._changeSummary = (d = this._changeTracker) == null ? void 0 : d.createChangeSummary(void 0);
+    super(i), this._debugNameData = e, this._computeFn = t, this._changeTracker = n, this._handleLastObserverRemoved = s, this._equalityComparator = o, this._state = 0, this._value = void 0, this._updateCount = 0, this._dependencies = /* @__PURE__ */ new Set(), this._dependenciesToBeRemoved = /* @__PURE__ */ new Set(), this._changeSummary = void 0, this._isUpdating = !1, this._isComputing = !1, this._didReportChange = !1, this._isInBeforeUpdate = !1, this._isReaderValid = !1, this._store = void 0, this._delayedStore = void 0, this._removedObserverToCallEndUpdateOn = null, this._changeSummary = (d = this._changeTracker) == null ? void 0 : d.createChangeSummary(void 0);
   }
   onLastObserverRemoved() {
     var e, t;
-    this._state = 0, this._value = void 0, (e = b()) == null || e.handleDerivedCleared(this);
+    this._state = 0, this._value = void 0, (e = C()) == null || e.handleDerivedCleared(this);
     for (const n of this._dependencies)
       n.removeObserver(this);
     this._dependencies.clear(), this._store !== void 0 && (this._store.dispose(), this._store = void 0), this._delayedStore !== void 0 && (this._delayedStore.dispose(), this._delayedStore = void 0), (t = this._handleLastObserverRemoved) == null || t.call(this);
@@ -503,20 +500,20 @@ class w extends Oe {
   get() {
     var t, n;
     if (this._isComputing, this._observers.size === 0) {
-      let r;
+      let s;
       try {
         this._isReaderValid = !0;
-        let i;
-        this._changeTracker && (i = this._changeTracker.createChangeSummary(void 0), (n = (t = this._changeTracker).beforeUpdate) == null || n.call(t, this, i)), r = this._computeFn(this, i);
+        let o;
+        this._changeTracker && (o = this._changeTracker.createChangeSummary(void 0), (n = (t = this._changeTracker).beforeUpdate) == null || n.call(t, this, o)), s = this._computeFn(this, o);
       } finally {
         this._isReaderValid = !1;
       }
-      return this.onLastObserverRemoved(), r;
+      return this.onLastObserverRemoved(), s;
     } else {
       do {
         if (this._state === 1) {
-          for (const r of this._dependencies)
-            if (r.reportChanges(), this._state === 2)
+          for (const s of this._dependencies)
+            if (s.reportChanges(), this._state === 2)
               break;
         }
         this._state === 1 && (this._state = 3), this._state !== 3 && this._recompute();
@@ -525,14 +522,14 @@ class w extends Oe {
     }
   }
   _recompute() {
-    var n, r, i, o;
+    var n, s, o, i;
     let e = !1;
     this._isComputing = !0, this._didReportChange = !1;
     const t = this._dependenciesToBeRemoved;
     this._dependenciesToBeRemoved = this._dependencies, this._dependencies = t;
     try {
       const d = this._changeSummary;
-      this._isReaderValid = !0, this._changeTracker && (this._isInBeforeUpdate = !0, (r = (n = this._changeTracker).beforeUpdate) == null || r.call(n, this, d), this._isInBeforeUpdate = !1, this._changeSummary = (i = this._changeTracker) == null ? void 0 : i.createChangeSummary(d));
+      this._isReaderValid = !0, this._changeTracker && (this._isInBeforeUpdate = !0, (s = (n = this._changeTracker).beforeUpdate) == null || s.call(n, this, d), this._isInBeforeUpdate = !1, this._changeSummary = (o = this._changeTracker) == null ? void 0 : o.createChangeSummary(d));
       const c = this._state !== 0, h = this._value;
       this._state = 3;
       const m = this._delayedStore;
@@ -541,11 +538,11 @@ class w extends Oe {
         this._store !== void 0 && (this._store.dispose(), this._store = void 0), this._value = this._computeFn(this, d);
       } finally {
         this._isReaderValid = !1;
-        for (const _ of this._dependenciesToBeRemoved)
-          _.removeObserver(this);
+        for (const v of this._dependenciesToBeRemoved)
+          v.removeObserver(this);
         this._dependenciesToBeRemoved.clear(), m !== void 0 && m.dispose();
       }
-      e = this._didReportChange || c && !this._equalityComparator(h, this._value), (o = b()) == null || o.handleObservableUpdated(this, {
+      e = this._didReportChange || c && !this._equalityComparator(h, this._value), (i = C()) == null || i.handleObservableUpdated(this, {
         oldValue: h,
         newValue: this._value,
         change: void 0,
@@ -553,7 +550,7 @@ class w extends Oe {
         hadValue: c
       });
     } catch (d) {
-      se(d);
+      re(d);
     }
     if (this._isComputing = !1, !this._didReportChange && e)
       for (const d of this._observers)
@@ -567,7 +564,7 @@ class w extends Oe {
   // IObserver Implementation
   beginUpdate(e) {
     if (this._isUpdating)
-      throw new O("Cyclic deriveds are not supported yet!");
+      throw new H("Cyclic deriveds are not supported yet!");
     this._updateCount++, this._isUpdating = !0;
     try {
       const t = this._updateCount === 1;
@@ -589,8 +586,8 @@ class w extends Oe {
       if (this._removedObserverToCallEndUpdateOn) {
         const n = [...this._removedObserverToCallEndUpdateOn];
         this._removedObserverToCallEndUpdateOn = null;
-        for (const r of n)
-          r.endUpdate(this);
+        for (const s of n)
+          s.endUpdate(this);
       }
     }
   }
@@ -604,27 +601,27 @@ class w extends Oe {
   handleChange(e, t) {
     var n;
     if (this._dependencies.has(e) && !this._dependenciesToBeRemoved.has(e) || this._isInBeforeUpdate) {
-      (n = b()) == null || n.handleDerivedDependencyChanged(this, e, t);
-      let r = !1;
+      (n = C()) == null || n.handleDerivedDependencyChanged(this, e, t);
+      let s = !1;
       try {
-        r = this._changeTracker ? this._changeTracker.handleChange({
+        s = this._changeTracker ? this._changeTracker.handleChange({
           changedObservable: e,
           change: t,
-          didChange: (o) => o === e
+          didChange: (i) => i === e
         }, this._changeSummary) : !0;
-      } catch (o) {
-        se(o);
+      } catch (i) {
+        re(i);
       }
-      const i = this._state === 3;
-      if (r && (this._state === 1 || i) && (this._state = 2, i))
-        for (const o of this._observers)
-          o.handlePossibleChange(this);
+      const o = this._state === 3;
+      if (s && (this._state === 1 || o) && (this._state = 2, o))
+        for (const i of this._observers)
+          i.handlePossibleChange(this);
     }
   }
   // IReader Implementation
   _ensureReaderValid() {
     if (!this._isReaderValid)
-      throw new O("The reader object cannot be used outside its compute function!");
+      throw new H("The reader object cannot be used outside its compute function!");
   }
   readObservable(e) {
     this._ensureReaderValid(), e.addObserver(this);
@@ -652,7 +649,7 @@ class w extends Oe {
   debugGetState() {
     return {
       state: this._state,
-      stateStr: qt(this._state),
+      stateStr: jt(this._state),
       updateCount: this._updateCount,
       isComputing: this._isComputing,
       dependencies: this._dependencies,
@@ -667,33 +664,33 @@ class w extends Oe {
   }
   setValue(e, t, n) {
     this._value = e;
-    const r = this._observers;
+    const s = this._observers;
     t.updateObserver(this, this);
-    for (const i of r)
-      i.handleChange(this, n);
+    for (const o of s)
+      o.handleChange(this, n);
   }
 }
-function F(s, e, t = T.ofCaller()) {
-  return e !== void 0 ? new w(new B(s, void 0, e), e, void 0, void 0, Q, t) : new w(new B(void 0, void 0, s), s, void 0, void 0, Q, t);
+function D(r, e, t = F.ofCaller()) {
+  return e !== void 0 ? new j(new E(r, void 0, e), e, void 0, void 0, X, t) : new j(new E(void 0, void 0, r), r, void 0, void 0, X, t);
 }
-function Kt(s, e, t = T.ofCaller()) {
-  return new w(new B(s.owner, s.debugName, s.debugReferenceFn), e, void 0, s.onLastObserverRemoved, s.equalsFn ?? Q, t);
+function Ut(r, e, t = F.ofCaller()) {
+  return new j(new E(r.owner, r.debugName, r.debugReferenceFn), e, void 0, r.onLastObserverRemoved, r.equalsFn ?? X, t);
 }
-Ut(Kt);
-function Jt(s, e, t = T.ofCaller()) {
-  let n, r;
-  n = s, r = void 0;
-  let i;
-  return new w(new B(r, void 0, n), (o) => {
-    i ? i.clear() : i = new Y();
-    const d = n(o);
-    return d && i.add(d), d;
+Bt(Ut);
+function Pt(r, e, t = F.ofCaller()) {
+  let n, s;
+  n = r, s = void 0;
+  let o;
+  return new j(new E(s, void 0, n), (i) => {
+    o ? o.clear() : o = new Y();
+    const d = n(i);
+    return d && o.add(d), d;
   }, void 0, () => {
-    i && (i.dispose(), i = void 0);
-  }, Q, t);
+    o && (o.dispose(), o = void 0);
+  }, X, t);
 }
-function Zt(s) {
-  switch (s) {
+function Wt(r) {
+  switch (r) {
     case 1:
       return "dependenciesMightHaveChanged";
     case 2:
@@ -704,13 +701,13 @@ function Zt(s) {
       return "<unknown>";
   }
 }
-class re {
+class Ye {
   get debugName() {
     return this._debugNameData.getDebugName(this) ?? "(anonymous)";
   }
-  constructor(e, t, n, r) {
-    var i, o;
-    this._debugNameData = e, this._runFn = t, this._changeTracker = n, this._state = 2, this._updateCount = 0, this._disposed = !1, this._dependencies = /* @__PURE__ */ new Set(), this._dependenciesToBeRemoved = /* @__PURE__ */ new Set(), this._isRunning = !1, this._store = void 0, this._delayedStore = void 0, this._changeSummary = (i = this._changeTracker) == null ? void 0 : i.createChangeSummary(void 0), (o = b()) == null || o.handleAutorunCreated(this, r), this._run();
+  constructor(e, t, n, s) {
+    var o, i;
+    this._debugNameData = e, this._runFn = t, this._changeTracker = n, this._state = 2, this._updateCount = 0, this._disposed = !1, this._dependencies = /* @__PURE__ */ new Set(), this._dependenciesToBeRemoved = /* @__PURE__ */ new Set(), this._isRunning = !1, this._store = void 0, this._delayedStore = void 0, this._changeSummary = (o = this._changeTracker) == null ? void 0 : o.createChangeSummary(void 0), (i = C()) == null || i.handleAutorunCreated(this, s), this._run();
   }
   dispose() {
     var e;
@@ -718,30 +715,30 @@ class re {
       this._disposed = !0;
       for (const t of this._dependencies)
         t.removeObserver(this);
-      this._dependencies.clear(), this._store !== void 0 && this._store.dispose(), this._delayedStore !== void 0 && this._delayedStore.dispose(), (e = b()) == null || e.handleAutorunDisposed(this);
+      this._dependencies.clear(), this._store !== void 0 && this._store.dispose(), this._delayedStore !== void 0 && this._delayedStore.dispose(), (e = C()) == null || e.handleAutorunDisposed(this);
     }
   }
   _run() {
-    var t, n, r, i;
+    var t, n, s, o;
     const e = this._dependenciesToBeRemoved;
     this._dependenciesToBeRemoved = this._dependencies, this._dependencies = e, this._state = 3;
     try {
       if (!this._disposed) {
-        (t = b()) == null || t.handleAutorunStarted(this);
-        const o = this._changeSummary, d = this._delayedStore;
+        (t = C()) == null || t.handleAutorunStarted(this);
+        const i = this._changeSummary, d = this._delayedStore;
         d !== void 0 && (this._delayedStore = void 0);
         try {
-          this._isRunning = !0, this._changeTracker && ((r = (n = this._changeTracker).beforeUpdate) == null || r.call(n, this, o), this._changeSummary = this._changeTracker.createChangeSummary(o)), this._store !== void 0 && (this._store.dispose(), this._store = void 0), this._runFn(this, o);
+          this._isRunning = !0, this._changeTracker && ((s = (n = this._changeTracker).beforeUpdate) == null || s.call(n, this, i), this._changeSummary = this._changeTracker.createChangeSummary(i)), this._store !== void 0 && (this._store.dispose(), this._store = void 0), this._runFn(this, i);
         } catch (c) {
-          se(c);
+          re(c);
         } finally {
           this._isRunning = !1, d !== void 0 && d.dispose();
         }
       }
     } finally {
-      this._disposed || (i = b()) == null || i.handleAutorunFinished(this);
-      for (const o of this._dependenciesToBeRemoved)
-        o.removeObserver(this);
+      this._disposed || (o = C()) == null || o.handleAutorunFinished(this);
+      for (const i of this._dependenciesToBeRemoved)
+        i.removeObserver(this);
       this._dependenciesToBeRemoved.clear();
     }
   }
@@ -774,15 +771,15 @@ class re {
   handleChange(e, t) {
     var n;
     if (this._isDependency(e)) {
-      (n = b()) == null || n.handleAutorunDependencyChanged(this, e, t);
+      (n = C()) == null || n.handleAutorunDependencyChanged(this, e, t);
       try {
         (this._changeTracker ? this._changeTracker.handleChange({
           changedObservable: e,
           change: t,
-          didChange: (i) => i === e
+          didChange: (o) => o === e
         }, this._changeSummary) : !0) && (this._state = 2);
-      } catch (r) {
-        se(r);
+      } catch (s) {
+        re(s);
       }
     }
   }
@@ -792,7 +789,7 @@ class re {
   // IReader implementation
   _ensureNoRunning() {
     if (!this._isRunning)
-      throw new O("The reader object cannot be used outside its compute function!");
+      throw new H("The reader object cannot be used outside its compute function!");
   }
   readObservable(e) {
     if (this._ensureNoRunning(), this._disposed)
@@ -803,12 +800,12 @@ class re {
   }
   get store() {
     if (this._ensureNoRunning(), this._disposed)
-      throw new O("Cannot access store after dispose");
+      throw new H("Cannot access store after dispose");
     return this._store === void 0 && (this._store = new Y()), this._store;
   }
   get delayedStore() {
     if (this._ensureNoRunning(), this._disposed)
-      throw new O("Cannot access store after dispose");
+      throw new H("Cannot access store after dispose");
     return this._delayedStore === void 0 && (this._delayedStore = new Y()), this._delayedStore;
   }
   debugGetState() {
@@ -817,42 +814,42 @@ class re {
       updateCount: this._updateCount,
       dependencies: this._dependencies,
       state: this._state,
-      stateStr: Zt(this._state)
+      stateStr: Wt(this._state)
     };
   }
   debugRerun() {
     this._isRunning ? this._state = 2 : this._run();
   }
 }
-function rt(s, e = T.ofCaller()) {
-  return new re(new B(void 0, void 0, s), s, void 0, e);
+function Qe(r, e = F.ofCaller()) {
+  return new Ye(new E(void 0, void 0, r), r, void 0, e);
 }
-function $e(s) {
-  const e = new Error("BugIndicatingErrorRecovery: " + s);
-  pe(e), console.error("recovered from an error that indicates a bug", e);
+function Fe(r) {
+  const e = new Error("BugIndicatingErrorRecovery: " + r);
+  Ht(e), console.error("recovered from an error that indicates a bug", e);
 }
-function it(s, e) {
-  const t = new ot(s, e);
+function et(r, e) {
+  const t = new tt(r, e);
   try {
-    s(t);
+    r(t);
   } finally {
     t.finish();
   }
 }
-function Xt(s, e, t) {
-  s ? e(s) : it(e, t);
+function Gt(r, e, t) {
+  r ? e(r) : et(e, t);
 }
-class ot {
+class tt {
   constructor(e, t) {
     var n;
-    this._fn = e, this._getDebugName = t, this._updatingObservers = [], (n = b()) == null || n.handleBeginTransaction(this);
+    this._fn = e, this._getDebugName = t, this._updatingObservers = [], (n = C()) == null || n.handleBeginTransaction(this);
   }
   getDebugName() {
-    return this._getDebugName ? this._getDebugName() : Ie(this._fn);
+    return this._getDebugName ? this._getDebugName() : ye(this._fn);
   }
   updateObserver(e, t) {
     if (!this._updatingObservers) {
-      $e("Transaction already finished!"), it((n) => {
+      Fe("Transaction already finished!"), et((n) => {
         n.updateObserver(e, t);
       });
       return;
@@ -863,48 +860,48 @@ class ot {
     var t;
     const e = this._updatingObservers;
     if (!e) {
-      $e("transaction.finish() has already been called!");
+      Fe("transaction.finish() has already been called!");
       return;
     }
     for (let n = 0; n < e.length; n++) {
-      const { observer: r, observable: i } = e[n];
-      r.endUpdate(i);
+      const { observer: s, observable: o } = e[n];
+      s.endUpdate(o);
     }
-    this._updatingObservers = null, (t = b()) == null || t.handleEndTransaction(this);
+    this._updatingObservers = null, (t = C()) == null || t.handleEndTransaction(this);
   }
   debugGetUpdatingObservers() {
     return this._updatingObservers;
   }
 }
-function x(s, e, t = T.ofCaller()) {
+function w(r, e, t = F.ofCaller()) {
   let n;
-  return typeof s == "string" ? n = new B(void 0, s, void 0) : n = new B(s, void 0, void 0), new ie(n, e, Q, t);
+  return typeof r == "string" ? n = new E(void 0, r, void 0) : n = new E(r, void 0, void 0), new rt(n, e, X, t);
 }
-class ie extends Oe {
+class rt extends xe {
   get debugName() {
     return this._debugNameData.getDebugName(this) ?? "ObservableValue";
   }
-  constructor(e, t, n, r) {
-    var i;
-    super(r), this._debugNameData = e, this._equalityComparator = n, this._value = t, (i = b()) == null || i.handleObservableUpdated(this, { hadValue: !1, newValue: t, change: void 0, didChange: !0, oldValue: void 0 });
+  constructor(e, t, n, s) {
+    var o;
+    super(s), this._debugNameData = e, this._equalityComparator = n, this._value = t, (o = C()) == null || o.handleObservableUpdated(this, { hadValue: !1, newValue: t, change: void 0, didChange: !0, oldValue: void 0 });
   }
   get() {
     return this._value;
   }
   set(e, t, n) {
-    var i;
+    var o;
     if (n === void 0 && this._equalityComparator(this._value, e))
       return;
-    let r;
-    t || (t = r = new ot(() => {
+    let s;
+    t || (t = s = new tt(() => {
     }, () => `Setting ${this.debugName}`));
     try {
-      const o = this._value;
-      this._setValue(e), (i = b()) == null || i.handleObservableUpdated(this, { oldValue: o, newValue: e, change: n, didChange: !0, hadValue: !0 });
+      const i = this._value;
+      this._setValue(e), (o = C()) == null || o.handleObservableUpdated(this, { oldValue: i, newValue: e, change: n, didChange: !0, hadValue: !0 });
       for (const d of this._observers)
         t.updateObserver(d, this), d.handleChange(this, n);
     } finally {
-      r && r.finish();
+      s && s.finish();
     }
   }
   toString() {
@@ -922,25 +919,25 @@ class ie extends Oe {
     this._value = e;
   }
 }
-function He(...s) {
-  let e, t, n, r;
-  return s.length === 2 ? [t, n] = s : [e, t, n, r] = s, new A(new B(e, void 0, n), t, n, () => A.globalTransaction, Q, r ?? T.ofCaller());
+function Ee(...r) {
+  let e, t, n, s;
+  return r.length === 2 ? [t, n] = r : [e, t, n, s] = r, new L(new E(e, void 0, n), t, n, () => L.globalTransaction, X, s ?? F.ofCaller());
 }
-class A extends Oe {
-  constructor(e, t, n, r, i, o) {
-    super(o), this._debugNameData = e, this.event = t, this._getValue = n, this._getTransaction = r, this._equalityComparator = i, this._hasValue = !1, this.handleEvent = (d) => {
-      var g;
+class L extends xe {
+  constructor(e, t, n, s, o, i) {
+    super(i), this._debugNameData = e, this.event = t, this._getValue = n, this._getTransaction = s, this._equalityComparator = o, this._hasValue = !1, this.handleEvent = (d) => {
+      var R;
       const c = this._getValue(d), h = this._value, m = !this._hasValue || !this._equalityComparator(h, c);
-      let _ = !1;
-      m && (this._value = c, this._hasValue && (_ = !0, Xt(this._getTransaction(), (v) => {
-        var E;
-        (E = b()) == null || E.handleObservableUpdated(this, { oldValue: h, newValue: c, change: void 0, didChange: m, hadValue: this._hasValue });
-        for (const V of this._observers)
-          v.updateObserver(V, this), V.handleChange(this, void 0);
+      let v = !1;
+      m && (this._value = c, this._hasValue && (v = !0, Gt(this._getTransaction(), (g) => {
+        var _;
+        (_ = C()) == null || _.handleObservableUpdated(this, { oldValue: h, newValue: c, change: void 0, didChange: m, hadValue: this._hasValue });
+        for (const b of this._observers)
+          g.updateObserver(b, this), b.handleChange(this, void 0);
       }, () => {
-        const v = this.getDebugName();
-        return "Event fired" + (v ? `: ${v}` : "");
-      })), this._hasValue = !0), _ || (g = b()) == null || g.handleObservableUpdated(this, { oldValue: h, newValue: c, change: void 0, didChange: m, hadValue: this._hasValue });
+        const g = this.getDebugName();
+        return "Event fired" + (g ? `: ${g}` : "");
+      })), this._hasValue = !0), v || (R = C()) == null || R.handleObservableUpdated(this, { oldValue: h, newValue: c, change: void 0, didChange: m, hadValue: this._hasValue });
     };
   }
   getDebugName() {
@@ -966,40 +963,40 @@ class A extends Oe {
     return { value: this._value, hasValue: this._hasValue };
   }
 }
-(function(s) {
-  s.Observer = A;
+(function(r) {
+  r.Observer = L;
   function e(t, n) {
-    let r = !1;
-    A.globalTransaction === void 0 && (A.globalTransaction = t, r = !0);
+    let s = !1;
+    L.globalTransaction === void 0 && (L.globalTransaction = t, s = !0);
     try {
       n();
     } finally {
-      r && (A.globalTransaction = void 0);
+      s && (L.globalTransaction = void 0);
     }
   }
-  s.batchEventsGlobally = e;
-})(He || (He = {}));
-function Qt(s) {
-  const e = new at(!1, void 0);
-  return s.addObserver(e), st(() => {
-    s.removeObserver(e);
+  r.batchEventsGlobally = e;
+})(Ee || (Ee = {}));
+function qt(r) {
+  const e = new nt(!1, void 0);
+  return r.addObserver(e), Xe(() => {
+    r.removeObserver(e);
   });
 }
-Pt(Qt);
-function Yt(s, e) {
-  const t = new at(!0, e);
-  s.addObserver(t);
+zt(qt);
+function Kt(r, e) {
+  const t = new nt(!0, e);
+  r.addObserver(t);
   try {
-    t.beginUpdate(s);
+    t.beginUpdate(r);
   } finally {
-    t.endUpdate(s);
+    t.endUpdate(r);
   }
-  return st(() => {
-    s.removeObserver(t);
+  return Xe(() => {
+    r.removeObserver(t);
   });
 }
-jt(Yt);
-class at {
+At(Kt);
+class nt {
   constructor(e, t) {
     this._forceRecompute = e, this._handleValue = t, this._counter = 0;
   }
@@ -1014,11 +1011,11 @@ class at {
   handleChange(e, t) {
   }
 }
-let ne;
-function en(s) {
-  ne || (ne = new tn(), Qe(ne)), ne.addFilteredObj(s);
+let te;
+function Jt(r) {
+  te || (te = new Zt(), Ot(te)), te.addFilteredObj(r);
 }
-class tn {
+class Zt {
   constructor() {
     this.indentation = 0, this.changedObservablesSets = /* @__PURE__ */ new WeakMap();
   }
@@ -1030,32 +1027,32 @@ class tn {
     return ((t = this._filteredObjects) == null ? void 0 : t.has(e)) ?? !0;
   }
   textToConsoleArgs(e) {
-    return nn([
-      G(on("|  ", this.indentation)),
+    return Xt([
+      U(tr("|  ", this.indentation)),
       e
     ]);
   }
   formatInfo(e) {
     return e.hadValue ? e.didChange ? [
-      G(" "),
-      I(M(e.oldValue, 70), {
+      U(" "),
+      I(Z(e.oldValue, 70), {
         color: "red",
         strikeThrough: !0
       }),
-      G(" "),
-      I(M(e.newValue, 60), {
+      U(" "),
+      I(Z(e.newValue, 60), {
         color: "green"
       })
-    ] : [G(" (unchanged)")] : [
-      G(" "),
-      I(M(e.newValue, 60), {
+    ] : [U(" (unchanged)")] : [
+      U(" "),
+      I(Z(e.newValue, 60), {
         color: "green"
       }),
-      G(" (initial)")
+      U(" (initial)")
     ];
   }
   handleObservableCreated(e) {
-    if (e instanceof w) {
+    if (e instanceof j) {
       const t = e;
       this.changedObservablesSets.set(t, /* @__PURE__ */ new Set());
     }
@@ -1064,12 +1061,12 @@ class tn {
   }
   handleObservableUpdated(e, t) {
     if (this._isIncluded(e)) {
-      if (e instanceof w) {
+      if (e instanceof j) {
         this._handleDerivedRecomputed(e, t);
         return;
       }
       console.log(...this.textToConsoleArgs([
-        W("observable value changed"),
+        P("observable value changed"),
         I(e.debugName, { color: "BlueViolet" }),
         ...this.formatInfo(t)
       ]));
@@ -1080,15 +1077,15 @@ class tn {
       return I(" (changed deps: " + [...e].map((t) => t.debugName).join(", ") + ")", { color: "gray" });
   }
   handleDerivedDependencyChanged(e, t, n) {
-    var r;
-    this._isIncluded(e) && ((r = this.changedObservablesSets.get(e)) == null || r.add(t));
+    var s;
+    this._isIncluded(e) && ((s = this.changedObservablesSets.get(e)) == null || s.add(t));
   }
   _handleDerivedRecomputed(e, t) {
     if (!this._isIncluded(e))
       return;
     const n = this.changedObservablesSets.get(e);
     n && (console.log(...this.textToConsoleArgs([
-      W("derived recomputed"),
+      P("derived recomputed"),
       I(e.debugName, { color: "BlueViolet" }),
       ...this.formatInfo(t),
       this.formatChanges(n),
@@ -1097,13 +1094,13 @@ class tn {
   }
   handleDerivedCleared(e) {
     this._isIncluded(e) && console.log(...this.textToConsoleArgs([
-      W("derived cleared"),
+      P("derived cleared"),
       I(e.debugName, { color: "BlueViolet" })
     ]));
   }
   handleFromEventObservableTriggered(e, t) {
     this._isIncluded(e) && console.log(...this.textToConsoleArgs([
-      W("observable from event triggered"),
+      P("observable from event triggered"),
       I(e.debugName, { color: "BlueViolet" }),
       ...this.formatInfo(t),
       { data: [{ fn: e._getValue }] }
@@ -1120,7 +1117,7 @@ class tn {
   handleAutorunStarted(e) {
     const t = this.changedObservablesSets.get(e);
     t && (this._isIncluded(e) && console.log(...this.textToConsoleArgs([
-      W("autorun"),
+      P("autorun"),
       I(e.debugName, { color: "BlueViolet" }),
       this.formatChanges(t),
       { data: [{ fn: e._debugNameData.referenceFn ?? e._runFn }] }
@@ -1132,7 +1129,7 @@ class tn {
   handleBeginTransaction(e) {
     let t = e.getDebugName();
     t === void 0 && (t = ""), this._isIncluded(e) && console.log(...this.textToConsoleArgs([
-      W("transaction"),
+      P("transaction"),
       I(t, { color: "BlueViolet" }),
       { data: [{ fn: e._fn }] }
     ])), this.indentation++;
@@ -1141,543 +1138,162 @@ class tn {
     this.indentation--;
   }
 }
-function nn(s) {
+function Xt(r) {
   const e = new Array(), t = [];
   let n = "";
-  function r(o) {
-    if ("length" in o)
-      for (const d of o)
-        d && r(d);
-    else "text" in o ? (n += `%c${o.text}`, e.push(o.style), o.data && t.push(...o.data)) : "data" in o && t.push(...o.data);
+  function s(i) {
+    if ("length" in i)
+      for (const d of i)
+        d && s(d);
+    else "text" in i ? (n += `%c${i.text}`, e.push(i.style), i.data && t.push(...i.data)) : "data" in i && t.push(...i.data);
   }
-  r(s);
-  const i = [n, ...e];
-  return i.push(...t), i;
+  s(r);
+  const o = [n, ...e];
+  return o.push(...t), o;
 }
-function G(s) {
-  return I(s, { color: "black" });
+function U(r) {
+  return I(r, { color: "black" });
 }
-function W(s) {
-  return I(an(`${s}: `, 10), { color: "black", bold: !0 });
+function P(r) {
+  return I(rr(`${r}: `, 10), { color: "black", bold: !0 });
 }
-function I(s, e = {
+function I(r, e = {
   color: "black"
 }) {
-  function t(r) {
-    return Object.entries(r).reduce((i, [o, d]) => `${i}${o}:${d};`, "");
+  function t(s) {
+    return Object.entries(s).reduce((o, [i, d]) => `${o}${i}:${d};`, "");
   }
   const n = {
     color: e.color
   };
   return e.strikeThrough && (n["text-decoration"] = "line-through"), e.bold && (n["font-weight"] = "bold"), {
-    text: s,
+    text: r,
     style: t(n)
   };
 }
-function M(s, e) {
-  switch (typeof s) {
+function Z(r, e) {
+  try {
+    return Yt(r, e);
+  } catch {
+    return "[[???]]";
+  }
+}
+function Yt(r, e) {
+  switch (typeof r) {
     case "number":
-      return "" + s;
+      return "" + r;
     case "string":
-      return s.length + 2 <= e ? `"${s}"` : `"${s.substr(0, e - 7)}"+...`;
+      return r.length + 2 <= e ? `"${r}"` : `"${r.substr(0, e - 7)}"+...`;
     case "boolean":
-      return s ? "true" : "false";
+      return r ? "true" : "false";
     case "undefined":
       return "undefined";
     case "object":
-      return s === null ? "null" : Array.isArray(s) ? sn(s, e) : rn(s, e);
+      return r === null ? "null" : Array.isArray(r) ? Qt(r, e) : er(r, e);
     case "symbol":
-      return s.toString();
+      return r.toString();
     case "function":
-      return `[[Function${s.name ? " " + s.name : ""}]]`;
+      return `[[Function${r.name ? " " + r.name : ""}]]`;
     default:
-      return "" + s;
+      return "" + r;
   }
 }
-function sn(s, e) {
+function Qt(r, e) {
   let t = "[ ", n = !0;
-  for (const r of s) {
+  for (const s of r) {
     if (n || (t += ", "), t.length - 5 > e) {
       t += "...";
       break;
     }
-    n = !1, t += `${M(r, e - t.length)}`;
+    n = !1, t += `${Z(s, e - t.length)}`;
   }
   return t += " ]", t;
 }
-function rn(s, e) {
-  if (typeof s.toString == "function" && s.toString !== Object.prototype.toString) {
-    const i = s.toString();
-    return i.length <= e ? i : i.substring(0, e - 3) + "...";
+function er(r, e) {
+  try {
+    if (typeof r.toString == "function" && r.toString !== Object.prototype.toString) {
+      const i = r.toString();
+      return i.length <= e ? i : i.substring(0, e - 3) + "...";
+    }
+  } catch {
+    return "[[Object]]";
+  }
+  const t = qe(r);
+  let n = t ? t + "(" : "{ ", s = !0, o;
+  try {
+    o = Object.entries(r);
+  } catch {
+    return t ? `${t}(...)` : "[[Object]]";
   }
-  const t = Ye(s);
-  let n = t ? t + "(" : "{ ", r = !0;
-  for (const [i, o] of Object.entries(s)) {
-    if (r || (n += ", "), n.length - 5 > e) {
+  for (const [i, d] of o) {
+    if (s || (n += ", "), n.length - 5 > e) {
       n += "...";
       break;
     }
-    r = !1, n += `${i}: ${M(o, e - n.length)}`;
+    s = !1, n += `${i}: ${Z(d, e - n.length)}`;
   }
   return n += t ? ")" : " }", n;
 }
-function on(s, e) {
+function tr(r, e) {
   let t = "";
   for (let n = 1; n <= e; n++)
-    t += s;
+    t += r;
   return t;
 }
-function an(s, e) {
-  for (; s.length < e; )
-    s += " ";
-  return s;
+function rr(r, e) {
+  for (; r.length < e; )
+    r += " ";
+  return r;
 }
-class oe {
-  static createHost(e, t) {
-    return new oe(e, t);
-  }
-  static createClient(e, t) {
-    return new oe(e, t);
-  }
-  constructor(e, t) {
-    this._channelFactory = e, this._getHandler = t, this._channel = this._channelFactory({
-      handleNotification: (i) => {
-        const o = i, d = this._getHandler().notifications[o[0]];
-        if (!d)
-          throw new Error(`Unknown notification "${o[0]}"!`);
-        d(...o[1]);
-      },
-      handleRequest: (i) => {
-        const o = i;
-        try {
-          return { type: "result", value: this._getHandler().requests[o[0]](...o[1]) };
-        } catch (d) {
-          return { type: "error", value: d };
-        }
-      }
-    });
-    const n = new Proxy({}, {
-      get: (i, o) => async (...d) => {
-        const c = await this._channel.sendRequest([o, d]);
-        if (c.type === "error")
-          throw c.value;
-        return c.value;
-      }
-    }), r = new Proxy({}, {
-      get: (i, o) => (...d) => {
-        this._channel.sendNotification([o, d]);
-      }
-    });
-    this.api = { notifications: r, requests: n };
-  }
-}
-function dn(s, e) {
-  const t = globalThis;
-  let n = [], r;
-  const { channel: i, handler: o } = cn({
-    sendNotification: (c) => {
-      r ? r.sendNotification(c) : n.push(c);
-    }
-  });
-  let d;
-  return (t.$$debugValueEditor_debugChannels ?? (t.$$debugValueEditor_debugChannels = {}))[s] = (c) => {
-    d = e(), r = c;
-    for (const h of n)
-      c.sendNotification(h);
-    return n = [], o;
-  }, oe.createClient(i, () => {
-    if (!d)
-      throw new Error("Not supported");
-    return d;
-  });
+function nr(r, e) {
+  const t = (e == null ? void 0 : e.debugNamePostProcessor) ?? ((o) => o), n = k.from(r, t);
+  return n ? st(n, 0, /* @__PURE__ */ new Set()).trim() : "";
 }
-function cn(s) {
-  let e;
-  return {
-    channel: (n) => (e = n, {
-      sendNotification: (r) => {
-        s.sendNotification(r);
-      },
-      sendRequest: (r) => {
-        throw new Error("not supported");
-      }
-    }),
-    handler: {
-      handleRequest: (n) => n.type === "notification" ? e == null ? void 0 : e.handleNotification(n.data) : e == null ? void 0 : e.handleRequest(n.data)
-    }
-  };
-}
-class ln {
-  constructor() {
-    this._timeout = void 0;
-  }
-  throttle(e, t) {
-    this._timeout === void 0 && (this._timeout = setTimeout(() => {
-      this._timeout = void 0, e();
-    }, t));
-  }
-  dispose() {
-    this._timeout !== void 0 && clearTimeout(this._timeout);
-  }
-}
-function dt(s, e) {
-  for (const t in e)
-    s[t] && typeof s[t] == "object" && e[t] && typeof e[t] == "object" ? dt(s[t], e[t]) : s[t] = e[t];
-}
-function ct(s, e) {
-  for (const t in e)
-    e[t] === null ? delete s[t] : s[t] && typeof s[t] == "object" && e[t] && typeof e[t] == "object" ? ct(s[t], e[t]) : s[t] = e[t];
-}
-class P {
-  static getInstance() {
-    return P._instance === void 0 && (P._instance = new P()), P._instance;
-  }
-  getTransactionState() {
-    const e = [], t = [...this._activeTransactions];
-    if (t.length === 0)
-      return;
-    const n = t.flatMap((i) => i.debugGetUpdatingObservers() ?? []).map((i) => i.observer), r = /* @__PURE__ */ new Set();
-    for (; n.length > 0; ) {
-      const i = n.shift();
-      if (r.has(i))
-        continue;
-      r.add(i);
-      const o = this._getInfo(i, (d) => {
-        r.has(d) || n.push(d);
-      });
-      o && e.push(o);
-    }
-    return { names: t.map((i) => i.getDebugName() ?? "tx"), affected: e };
-  }
-  _getObservableInfo(e) {
-    const t = this._instanceInfos.get(e);
-    if (!t) {
-      pe(new O("No info found"));
-      return;
-    }
-    return t;
-  }
-  _getAutorunInfo(e) {
-    const t = this._instanceInfos.get(e);
-    if (!t) {
-      pe(new O("No info found"));
-      return;
-    }
-    return t;
-  }
-  _getInfo(e, t) {
-    if (e instanceof w) {
-      const n = [...e.debugGetObservers()];
-      for (const c of n)
-        t(c);
-      const r = this._getObservableInfo(e);
-      if (!r)
-        return;
-      const i = e.debugGetState(), o = { name: e.debugName, instanceId: r.instanceId, updateCount: i.updateCount }, d = [...r.changedObservables].map((c) => {
-        var h;
-        return (h = this._instanceInfos.get(c)) == null ? void 0 : h.instanceId;
-      }).filter(ee);
-      if (i.isComputing)
-        return { ...o, type: "observable/derived", state: "updating", changedDependencies: d, initialComputation: !1 };
-      switch (i.state) {
-        case 0:
-          return { ...o, type: "observable/derived", state: "noValue" };
-        case 3:
-          return { ...o, type: "observable/derived", state: "upToDate" };
-        case 2:
-          return { ...o, type: "observable/derived", state: "stale", changedDependencies: d };
-        case 1:
-          return { ...o, type: "observable/derived", state: "possiblyStale" };
-      }
-    } else if (e instanceof re) {
-      const n = this._getAutorunInfo(e);
-      if (!n)
-        return;
-      const r = { name: e.debugName, instanceId: n.instanceId, updateCount: n.updateCount }, i = [...n.changedObservables].map((o) => this._instanceInfos.get(o).instanceId);
-      if (e.debugGetState().isRunning)
-        return { ...r, type: "autorun", state: "updating", changedDependencies: i };
-      switch (e.debugGetState().state) {
-        case 3:
-          return { ...r, type: "autorun", state: "upToDate" };
-        case 2:
-          return { ...r, type: "autorun", state: "stale", changedDependencies: i };
-        case 1:
-          return { ...r, type: "autorun", state: "possiblyStale" };
-      }
-    }
-  }
-  _formatObservable(e) {
-    const t = this._getObservableInfo(e);
-    if (t)
-      return { name: e.debugName, instanceId: t.instanceId };
-  }
-  _formatObserver(e) {
-    var n;
-    if (e instanceof w)
-      return { name: e.toString(), instanceId: (n = this._getObservableInfo(e)) == null ? void 0 : n.instanceId };
-    const t = this._getAutorunInfo(e);
-    if (t)
-      return { name: e.toString(), instanceId: t.instanceId };
-  }
-  constructor() {
-    this._declarationId = 0, this._instanceId = 0, this._declarations = /* @__PURE__ */ new Map(), this._instanceInfos = /* @__PURE__ */ new WeakMap(), this._aliveInstances = /* @__PURE__ */ new Map(), this._activeTransactions = /* @__PURE__ */ new Set(), this._channel = dn("observableDevTools", () => ({
-      notifications: {
-        setDeclarationIdFilter: (e) => {
-        },
-        logObservableValue: (e) => {
-          console.log("logObservableValue", e);
-        },
-        flushUpdates: () => {
-          this._flushUpdates();
-        },
-        resetUpdates: () => {
-          this._pendingChanges = null, this._channel.api.notifications.handleChange(this._fullState, !0);
-        }
-      },
-      requests: {
-        getDeclarations: () => {
-          const e = {};
-          for (const t of this._declarations.values())
-            e[t.id] = t;
-          return { decls: e };
-        },
-        getSummarizedInstances: () => null,
-        getObservableValueInfo: (e) => ({
-          observers: [...this._aliveInstances.get(e).debugGetObservers()].map((n) => this._formatObserver(n)).filter(ee)
-        }),
-        getDerivedInfo: (e) => {
-          const t = this._aliveInstances.get(e);
-          return {
-            dependencies: [...t.debugGetState().dependencies].map((n) => this._formatObservable(n)).filter(ee),
-            observers: [...t.debugGetObservers()].map((n) => this._formatObserver(n)).filter(ee)
-          };
-        },
-        getAutorunInfo: (e) => ({
-          dependencies: [...this._aliveInstances.get(e).debugGetState().dependencies].map((n) => this._formatObservable(n)).filter(ee)
-        }),
-        getTransactionState: () => this.getTransactionState(),
-        setValue: (e, t) => {
-          const n = this._aliveInstances.get(e);
-          if (n instanceof w)
-            n.debugSetValue(t);
-          else if (n instanceof ie)
-            n.debugSetValue(t);
-          else if (n instanceof A)
-            n.debugSetValue(t);
-          else
-            throw new O("Observable is not supported");
-          const r = [...n.debugGetObservers()];
-          for (const i of r)
-            i.beginUpdate(n);
-          for (const i of r)
-            i.handleChange(n, void 0);
-          for (const i of r)
-            i.endUpdate(n);
-        },
-        getValue: (e) => {
-          const t = this._aliveInstances.get(e);
-          if (t instanceof w)
-            return M(t.debugGetState().value, 200);
-          if (t instanceof ie)
-            return M(t.debugGetState().value, 200);
-        },
-        logValue: (e) => {
-          const t = this._aliveInstances.get(e);
-          if (t && "get" in t)
-            console.log("Logged Value:", t.get());
-          else
-            throw new O("Observable is not supported");
-        },
-        rerun: (e) => {
-          const t = this._aliveInstances.get(e);
-          if (t instanceof w)
-            t.debugRecompute();
-          else if (t instanceof re)
-            t.debugRerun();
-          else
-            throw new O("Observable is not supported");
-        }
-      }
-    })), this._pendingChanges = null, this._changeThrottler = new ln(), this._fullState = {}, this._flushUpdates = () => {
-      this._pendingChanges !== null && (this._channel.api.notifications.handleChange(this._pendingChanges, !1), this._pendingChanges = null);
-    }, T.enable();
-  }
-  _handleChange(e) {
-    ct(this._fullState, e), this._pendingChanges === null ? this._pendingChanges = e : dt(this._pendingChanges, e), this._changeThrottler.throttle(this._flushUpdates, 10);
-  }
-  _getDeclarationId(e, t) {
-    if (!t)
-      return -1;
-    let n = this._declarations.get(t.id);
-    return n === void 0 && (n = {
-      id: this._declarationId++,
-      type: e,
-      url: t.fileName,
-      line: t.line,
-      column: t.column
-    }, this._declarations.set(t.id, n), this._handleChange({ decls: { [n.id]: n } })), n.id;
-  }
-  handleObservableCreated(e, t) {
-    const r = {
-      declarationId: this._getDeclarationId("observable/value", t),
-      instanceId: this._instanceId++,
-      listenerCount: 0,
-      lastValue: void 0,
-      updateCount: 0,
-      changedObservables: /* @__PURE__ */ new Set()
-    };
-    this._instanceInfos.set(e, r);
-  }
-  handleOnListenerCountChanged(e, t) {
-    const n = this._getObservableInfo(e);
-    if (n) {
-      if (n.listenerCount === 0 && t > 0) {
-        const r = e instanceof w ? "observable/derived" : "observable/value";
-        this._aliveInstances.set(n.instanceId, e), this._handleChange({
-          instances: {
-            [n.instanceId]: {
-              instanceId: n.instanceId,
-              declarationId: n.declarationId,
-              formattedValue: n.lastValue,
-              type: r,
-              name: e.debugName
-            }
-          }
-        });
-      } else n.listenerCount > 0 && t === 0 && (this._handleChange({
-        instances: { [n.instanceId]: null }
-      }), this._aliveInstances.delete(n.instanceId));
-      n.listenerCount = t;
-    }
-  }
-  handleObservableUpdated(e, t) {
-    if (e instanceof w) {
-      this._handleDerivedRecomputed(e, t);
-      return;
-    }
-    const n = this._getObservableInfo(e);
-    n && t.didChange && (n.lastValue = M(t.newValue, 30), n.listenerCount > 0 && this._handleChange({
-      instances: { [n.instanceId]: { formattedValue: n.lastValue } }
-    }));
-  }
-  handleAutorunCreated(e, t) {
-    const r = {
-      declarationId: this._getDeclarationId("autorun", t),
-      instanceId: this._instanceId++,
-      updateCount: 0,
-      changedObservables: /* @__PURE__ */ new Set()
-    };
-    this._instanceInfos.set(e, r), this._aliveInstances.set(r.instanceId, e), r && this._handleChange({
-      instances: {
-        [r.instanceId]: {
-          instanceId: r.instanceId,
-          declarationId: r.declarationId,
-          runCount: 0,
-          type: "autorun",
-          name: e.debugName
-        }
-      }
-    });
-  }
-  handleAutorunDisposed(e) {
-    const t = this._getAutorunInfo(e);
-    t && (this._handleChange({
-      instances: { [t.instanceId]: null }
-    }), this._instanceInfos.delete(e), this._aliveInstances.delete(t.instanceId));
-  }
-  handleAutorunDependencyChanged(e, t, n) {
-    const r = this._getAutorunInfo(e);
-    r && r.changedObservables.add(t);
-  }
-  handleAutorunStarted(e) {
-  }
-  handleAutorunFinished(e) {
-    const t = this._getAutorunInfo(e);
-    t && (t.changedObservables.clear(), t.updateCount++, this._handleChange({
-      instances: { [t.instanceId]: { runCount: t.updateCount } }
-    }));
-  }
-  handleDerivedDependencyChanged(e, t, n) {
-    const r = this._getObservableInfo(e);
-    r && r.changedObservables.add(t);
-  }
-  _handleDerivedRecomputed(e, t) {
-    const n = this._getObservableInfo(e);
-    if (!n)
-      return;
-    const r = M(t.newValue, 30);
-    n.updateCount++, n.changedObservables.clear(), n.lastValue = r, n.listenerCount > 0 && this._handleChange({
-      instances: { [n.instanceId]: { formattedValue: r, recomputationCount: n.updateCount } }
-    });
-  }
-  handleDerivedCleared(e) {
-    const t = this._getObservableInfo(e);
-    t && (t.lastValue = void 0, t.changedObservables.clear(), t.listenerCount > 0 && this._handleChange({
-      instances: {
-        [t.instanceId]: {
-          formattedValue: void 0
-        }
-      }
-    }));
-  }
-  handleBeginTransaction(e) {
-    this._activeTransactions.add(e);
-  }
-  handleEndTransaction(e) {
-    this._activeTransactions.delete(e);
-  }
-}
-P._instance = void 0;
-function hn(s, e) {
-  const t = (e == null ? void 0 : e.debugNamePostProcessor) ?? ((i) => i), n = R.from(s, t);
-  return n ? lt(n, 0, /* @__PURE__ */ new Set()).trim() : "";
-}
-function lt(s, e, t) {
-  const n = "		".repeat(e), r = [];
-  if (t.has(s.sourceObj))
-    return r.push(`${n}* ${s.type} ${s.name} (already listed)`), r.join(`
+function st(r, e, t) {
+  const n = "		".repeat(e), s = [];
+  if (t.has(r.sourceObj))
+    return s.push(`${n}* ${r.type} ${r.name} (already listed)`), s.join(`
 `);
-  if (t.add(s.sourceObj), r.push(`${n}* ${s.type} ${s.name}:`), r.push(`${n}  value: ${M(s.value, 50)}`), r.push(`${n}  state: ${s.state}`), s.dependencies.length > 0) {
-    r.push(`${n}  dependencies:`);
-    for (const o of s.dependencies)
-      r.push(lt(o, e + 1, t));
+  if (t.add(r.sourceObj), s.push(`${n}* ${r.type} ${r.name}:`), s.push(`${n}  value: ${Z(r.value, 50)}`), s.push(`${n}  state: ${r.state}`), r.dependencies.length > 0) {
+    s.push(`${n}  dependencies:`);
+    for (const i of r.dependencies)
+      s.push(st(i, e + 1, t));
   }
-  return r.join(`
+  return s.join(`
 `);
 }
-class R {
+class k {
   static from(e, t) {
-    if (e instanceof re) {
+    if (e instanceof Ye) {
       const n = e.debugGetState();
-      return new R(e, t(e.debugName), "autorun", void 0, n.stateStr, Array.from(n.dependencies).map((r) => R.from(r, t) || R.unknown(r)));
-    } else if (e instanceof w) {
+      return new k(e, t(e.debugName), "autorun", void 0, n.stateStr, Array.from(n.dependencies).map((s) => k.from(s, t) || k.unknown(s)));
+    } else if (e instanceof j) {
       const n = e.debugGetState();
-      return new R(e, t(e.debugName), "derived", n.value, n.stateStr, Array.from(n.dependencies).map((r) => R.from(r, t) || R.unknown(r)));
-    } else if (e instanceof ie) {
+      return new k(e, t(e.debugName), "derived", n.value, n.stateStr, Array.from(n.dependencies).map((s) => k.from(s, t) || k.unknown(s)));
+    } else if (e instanceof rt) {
       const n = e.debugGetState();
-      return new R(e, t(e.debugName), "observableValue", n.value, "upToDate", []);
-    } else if (e instanceof A) {
+      return new k(e, t(e.debugName), "observableValue", n.value, "upToDate", []);
+    } else if (e instanceof L) {
       const n = e.debugGetState();
-      return new R(e, t(e.debugName), "fromEvent", n.value, n.hasValue ? "upToDate" : "initial", []);
+      return new k(e, t(e.debugName), "fromEvent", n.value, n.hasValue ? "upToDate" : "initial", []);
     }
   }
   static unknown(e) {
-    return new R(e, "(unknown)", "unknown", void 0, "unknown", []);
+    return new k(e, "(unknown)", "unknown", void 0, "unknown", []);
   }
-  constructor(e, t, n, r, i, o) {
-    this.sourceObj = e, this.name = t, this.type = n, this.value = r, this.state = i, this.dependencies = o;
+  constructor(e, t, n, s, o, i) {
+    this.sourceObj = e, this.name = t, this.type = n, this.value = s, this.state = o, this.dependencies = i;
   }
 }
-Gt(hn);
-Et(en);
-Qe(P.getInstance());
-class un {
+$t(nr);
+kt(Jt);
+class sr {
   constructor() {
-    l(this, "_fixtures", x(this, /* @__PURE__ */ new Map()));
+    l(this, "_fixtures", w(this, /* @__PURE__ */ new Map()));
     /** Observable root of the fixture tree */
-    l(this, "root", F(this, (e) => {
+    l(this, "root", D(this, (e) => {
       const t = this._fixtures.read(e);
-      return le(t);
+      return ie(t);
     }));
   }
   /**
@@ -1708,18 +1324,18 @@ class un {
    */
   getNode(e, t) {
     const n = this.root.read(e);
-    return Fe(n, t);
+    return ke(n, t);
   }
   /**
    * Gets a component by path (non-reactive, for use in preview iframe).
    * @param path Array of path segments (e.g., ['Button', 'Primary'])
    */
   getComponentByPath(e) {
-    const t = this._fixtures.get(), n = le(t), r = Fe(n, e);
-    return r == null ? void 0 : r.component;
+    const t = this._fixtures.get(), n = ie(t), s = ke(n, e);
+    return s == null ? void 0 : s.component;
   }
 }
-class As {
+class kn {
   constructor(e, t) {
     l(this, "sessionId", Math.random().toString(36).slice(2));
     l(this, "_updateVersion", 0);
@@ -1746,17 +1362,18 @@ class As {
     return this._flattenFixtures(this._root);
   }
   async renderFixture(e) {
+    var R;
     const t = this._findFixtureNode(this._root, e);
     if (!t || !t.component)
       throw new Error("Fixture not found: " + e);
-    this._currentDisposable && (this._currentDisposable.dispose(), this._currentDisposable = void 0), this._currentContainer && (this._currentContainer.remove(), this._currentContainer = void 0);
+    (R = this._currentDisposable) != null && R.dispose && this._currentDisposable.dispose(), this._currentDisposable = void 0, this._currentContainer && (this._currentContainer.remove(), this._currentContainer = void 0);
     const n = document.createElement("div");
     n.style.display = "inline-block", this._containerElement.appendChild(n), this._currentContainer = n;
-    const r = t.component, i = Dt(r.properties);
-    let o = n;
-    if (r.isolation === "shadow-dom") {
+    const s = t.component, o = Rt(s.properties);
+    let i = n;
+    if (s.isolation === "shadow-dom") {
       const g = n.attachShadow({ mode: "open" });
-      o = document.createElement("div"), g.appendChild(o);
+      i = document.createElement("div"), g.appendChild(i);
     }
     const d = [], c = console.error, h = console.warn;
     console.error = (...g) => {
@@ -1765,47 +1382,62 @@ class As {
       d.push({ kind: "console", level: "warn", message: g.map(String).join(" ") }), h.apply(console, g);
     };
     const m = (g) => {
-      var v;
-      d.push({ kind: "exception", message: g.message, stack: (v = g.error) == null ? void 0 : v.stack });
-    }, _ = (g) => {
-      const v = g.reason, E = v instanceof Error ? v.message : String(v), V = v instanceof Error ? v.stack : void 0;
-      d.push({ kind: "exception", message: E, stack: V });
+      var _;
+      d.push({ kind: "exception", message: g.message, stack: (_ = g.error) == null ? void 0 : _.stack });
+    }, v = (g) => {
+      const _ = g.reason, b = _ instanceof Error ? _.message : String(_), y = _ instanceof Error ? _.stack : void 0;
+      d.push({ kind: "exception", message: b, stack: y });
     };
-    window.addEventListener("error", m), window.addEventListener("unhandledrejection", _);
+    window.addEventListener("error", m), window.addEventListener("unhandledrejection", v);
     try {
-      const g = r.render(o, i);
-      this._currentDisposable = g && typeof g == "object" && "dispose" in g ? g : void 0;
+      const g = new AbortController(), _ = 3e3;
+      let b = s.render(i, {
+        props: o,
+        signal: g.signal
+      });
+      if (b instanceof Promise) {
+        const y = new Promise((x) => setTimeout(() => x("timeout"), _)), O = await Promise.race([b.then((x) => ({ resolved: x })), y]);
+        O === "timeout" ? (g.abort(), d.push({ kind: "exception", message: `Fixture render() timed out after ${_}ms` }), b.then((x) => {
+          var ee;
+          return (ee = x == null ? void 0 : x.dispose) == null ? void 0 : ee.call(x);
+        }).catch(() => {
+        }), b = void 0) : b = O.resolved;
+      }
+      if (this._currentDisposable = b ?? void 0, b != null && b.ready) {
+        const y = new Promise((x) => setTimeout(() => x("timeout"), _));
+        await Promise.race([b.ready.then(() => "done"), y]) === "timeout" && (g.abort(), d.push({ kind: "exception", message: `Fixture ready promise timed out after ${_}ms` }));
+      }
     } catch (g) {
-      const v = g instanceof Error ? g : new Error(String(g));
-      d.push({ kind: "exception", message: v.message, stack: v.stack });
+      const _ = g instanceof Error ? g : new Error(String(g));
+      d.push({ kind: "exception", message: _.message, stack: _.stack });
     } finally {
       console.error = c, console.warn = h;
     }
-    return await new Promise((g) => requestAnimationFrame(() => requestAnimationFrame(() => g()))), window.removeEventListener("error", m), window.removeEventListener("unhandledrejection", _), { errors: d };
+    return await new Promise((g) => requestAnimationFrame(() => requestAnimationFrame(() => g()))), window.removeEventListener("error", m), window.removeEventListener("unhandledrejection", v), { errors: d };
   }
   _buildRegistry() {
     const e = /* @__PURE__ */ new Map();
     for (const [t, n] of Object.entries(this._fixtureModules)) {
-      const r = n.default;
-      r && typeof r == "object" && e.set(t, r);
+      const s = n.default;
+      s && typeof s == "object" && e.set(t, s);
     }
-    return le(e);
+    return ie(e);
   }
   _flattenFixtures(e, t = []) {
-    var r;
+    var s;
     const n = [];
-    e.type === "component" && n.push({ fixtureId: e.id, fixtureName: e.name, groupPath: t, background: ((r = e.component) == null ? void 0 : r.background) ?? "light" });
-    for (const i of e.children ?? []) {
-      const o = e.id ? [...t, e.name] : t;
-      n.push(...this._flattenFixtures(i, o));
+    e.type === "component" && n.push({ fixtureId: e.id, fixtureName: e.name, groupPath: t, background: ((s = e.component) == null ? void 0 : s.background) ?? "light" });
+    for (const o of e.children ?? []) {
+      const i = e.id ? [...t, e.name] : t;
+      n.push(...this._flattenFixtures(o, i));
     }
     return n;
   }
   _findFixtureNode(e, t) {
     if (e.id === t) return e;
     for (const n of e.children ?? []) {
-      const r = this._findFixtureNode(n, t);
-      if (r) return r;
+      const s = this._findFixtureNode(n, t);
+      if (s) return s;
     }
   }
   _installGlobalApi() {
@@ -1821,7 +1453,7 @@ class As {
     });
   }
 }
-class fn {
+class or {
   constructor(e) {
     this._run = e, this._changes = [], this._map = /* @__PURE__ */ new Map(), this._updateCounter = 0;
   }
@@ -1848,48 +1480,48 @@ class fn {
   }
 }
 function u() {
-  return ge.instance;
+  return le.instance;
 }
-function pn() {
-  return me.instance;
+function ir() {
+  return he.instance;
 }
-function gn() {
-  return ve.instance;
+function ar() {
+  return ue.instance;
 }
-u.const = pn;
-u.obs = gn;
-class ge {
+u.const = ir;
+u.obs = ar;
+class le {
   create(e) {
-    const t = F((n) => e(n));
+    const t = D((n) => e(n));
     return { read: (n) => t };
   }
 }
-ge.instance = new ge();
-class me {
+le.instance = new le();
+class he {
   create(e) {
-    const t = F((n) => e(n));
+    const t = D((n) => e(n));
     return { read: (n) => t.read(n) };
   }
 }
-me.instance = new me();
-class ve {
+he.instance = new he();
+class ue {
   create(e) {
-    const t = F((n) => {
-      const r = e(n);
-      return mn(r) ? r.read(n) : r;
+    const t = D((n) => {
+      const s = e(n);
+      return dr(s) ? s.read(n) : s;
     });
     return { read: (n) => t };
   }
 }
-ve.instance = new ve();
-function mn(s) {
-  return typeof s == "object" && s !== null && "read" in s;
+ue.instance = new ue();
+function dr(r) {
+  return typeof r == "object" && r !== null && "read" in r;
 }
-function Z(s, e) {
-  return Object.fromEntries(Object.entries(s).map(([t, n]) => [t, e(n, t)]));
+function K(r, e) {
+  return Object.fromEntries(Object.entries(r).map(([t, n]) => [t, e(n, t)]));
 }
-const de = Symbol("ViewModelContext");
-class vn {
+const se = Symbol("ViewModelContext");
+class cr {
   constructor(e) {
     this._store = new Y(), this.props = e;
   }
@@ -1897,35 +1529,35 @@ class vn {
     this._store.dispose();
   }
 }
-function _n(s) {
-  return s[de] || (s[de] = Je(void 0)), s[de];
+function lr(r) {
+  return r[se] || (r[se] = Pe(void 0)), r[se];
 }
-function z(s = {}) {
+function B(r = {}) {
   var e;
-  return e = class extends vn {
-  }, e._props = s, e;
+  return e = class extends cr {
+  }, e._props = r, e;
 }
-let _e = 0;
-const bn = new fn((s) => {
-  for (const e of s)
+let pe = 0;
+const hr = new or((r) => {
+  for (const e of r)
     e.rendered = !1;
-  if (_e > 0) {
-    const e = s.find((t) => t.isRendering);
-    e.itemsToRender = s;
+  if (pe > 0) {
+    const e = r.find((t) => t.isRendering);
+    e.itemsToRender = r;
   } else
-    Ze(() => {
-      for (const e of s)
+    We(() => {
+      for (const e of r)
         e.rendered || e.forceUpdate();
     });
 });
-let yn = 0;
-class xn {
+let ur = 0;
+class pr {
   constructor(e, t) {
     this.debugName = e, this.renderFactory = t, this._obsProps = void 0, this.forceUpdate = void 0, this._render = void 0, this._disposable = void 0, this.contextValues = /* @__PURE__ */ new Map(), this.cleanupEffect = () => () => {
       var n;
       (n = this._disposable) == null || n.dispose();
     }, this.itemsToRender = [], this.handleAfterRender = () => {
-      Ze(() => {
+      We(() => {
         for (const n of this.itemsToRender)
           n.rendered || n.forceUpdate();
       }), this.itemsToRender = [];
@@ -1935,139 +1567,139 @@ class xn {
     return this.debugName;
   }
   updateProps(e) {
-    this._obsProps ? this._obsProps.set(e, void 0) : (this._obsProps = x(this, e), this._render = this.renderFactory(this._obsProps, () => this.contextValues), this.rendering = F(this, this._render), this._disposable = bn.addDependency(this.rendering, this));
+    this._obsProps ? this._obsProps.set(e, void 0) : (this._obsProps = w(this, e), this._render = this.renderFactory(this._obsProps, () => this.contextValues), this.rendering = D(this, this._render), this._disposable = hr.addDependency(this.rendering, this));
   }
 }
-function Re(s, e, t) {
-  const n = (o) => o + 1, r = () => new xn(s + ++yn, e), i = function(o) {
-    const d = Ot(n, 0)[1], c = Rt(r)[0];
+function Ce(r, e, t) {
+  const n = (i) => i + 1, s = () => new pr(r + ++ur, e), o = function(i) {
+    const d = bt(n, 0)[1], c = yt(s)[0];
     for (const h of t ?? [])
-      c.contextValues.set(h, Tt(h));
-    if (De(c.cleanupEffect, []), De(c.handleAfterRender), c.isRendering)
+      c.contextValues.set(h, xt(h));
+    if (Ie(c.cleanupEffect, []), Ie(c.handleAfterRender), c.isRendering)
       throw new Error("Component is already rendering");
-    c.isRendering = !0, _e++;
+    c.isRendering = !0, pe++;
     try {
-      c.forceUpdate = d, c.updateProps(o);
+      c.forceUpdate = d, c.updateProps(i);
       const h = c.rendering.get();
       return c.rendered = !0, h;
     } finally {
-      c.isRendering = !1, _e--;
+      c.isRendering = !1, pe--;
     }
   };
-  return i.displayName = s, i;
-}
-Re("ObsView", (s) => (e) => s.read(e).children(e));
-function k(s, e) {
-  return Re("view", (t) => {
-    const n = Z(s, (r, i) => r.create((o) => t.read(o)[i], void 0));
-    return (r) => {
-      const i = Z(n, (o) => o.read(r));
-      return e(r, i);
+  return o.displayName = r, o;
+}
+Ce("ObsView", (r) => (e) => r.read(e).children(e));
+function V(r, e) {
+  return Ce("view", (t) => {
+    const n = K(r, (s, o) => s.create((i) => t.read(i)[o], void 0));
+    return (s) => {
+      const o = K(n, (i) => i.read(s));
+      return e(s, o);
     };
   });
 }
-function Cn(s) {
+function fr(r) {
   const e = [];
-  for (const t of Object.values(s)) {
+  for (const t of Object.values(r)) {
     const n = t._requiredContext;
     n && !e.includes(n) && e.push(n);
   }
   return e;
 }
-function $(s, e, t) {
-  const n = typeof e == "function" ? {} : e, r = typeof e == "function" ? e : t, i = "_props" in s ? s._props : {}, o = Cn({ ...i, ...n }), d = _n(s), c = [...o, d];
-  return Re("viewWithModel", (h, m) => {
-    const _ = m(), g = _.get(d), v = "_props" in s ? Z(s._props, (S, H) => S.create((L) => h.read(L)[H], _.get(S._requiredContext))) : {}, E = g ? { read: () => g, dispose: () => {
-    } } : Jt((S) => {
-      const H = Z(v, (L) => L.read(S));
-      return new s(H);
-    }), V = Z(n, (S, H) => S.create((L) => h.read(L)[H], _.get(S._requiredContext)));
-    return (S) => {
-      const H = E.read(S), L = Z(V, (Ct) => Ct.read(S));
-      return r(S, H, L);
+function A(r, e, t) {
+  const n = typeof e == "function" ? {} : e, s = typeof e == "function" ? e : t, o = "_props" in r ? r._props : {}, i = fr({ ...o, ...n }), d = lr(r), c = [...i, d];
+  return Ce("viewWithModel", (h, m) => {
+    const v = m(), R = v.get(d), g = "_props" in r ? K(r._props, (y, O) => y.create((x) => h.read(x)[O], v.get(y._requiredContext))) : {}, _ = R ? { read: () => R, dispose: () => {
+    } } : Pt((y) => {
+      const O = K(g, (x) => x.read(y));
+      return new r(O);
+    }), b = K(n, (y, O) => y.create((x) => h.read(x)[O], v.get(y._requiredContext)));
+    return (y) => {
+      const O = _.read(y), x = K(b, (ee) => ee.read(y));
+      return s(y, O, x);
     };
   }, c.length > 0 ? c : void 0);
 }
-k({ value: u.obs() }, (s, e) => e.value.read(s));
-Je(null);
-function ht(s) {
+V({ value: u.obs() }, (r, e) => e.value.read(r));
+Pe(null);
+function ot(r) {
   var e;
   return {
-    id: s.id,
-    name: s.name,
-    type: s.type,
-    children: (e = s.children) == null ? void 0 : e.map(ht),
-    component: s.component
+    id: r.id,
+    name: r.name,
+    type: r.type,
+    children: (e = r.children) == null ? void 0 : e.map(ot),
+    component: r.component
   };
 }
-function te(s, e) {
+function Q(r, e) {
   const {
     storageKey: t,
     defaultValue: n,
-    serialize: r = JSON.stringify,
-    deserialize: i = JSON.parse
+    serialize: s = JSON.stringify,
+    deserialize: o = JSON.parse
   } = e;
-  let o = n;
+  let i = n;
   try {
     const h = localStorage.getItem(t);
-    h !== null && (o = i(h));
+    h !== null && (i = o(h));
   } catch {
   }
-  const d = x(s, o), c = d.set.bind(d);
+  const d = w(r, i), c = d.set.bind(d);
   return d.set = (h, m) => {
     try {
-      localStorage.setItem(t, r(h));
+      localStorage.setItem(t, s(h));
     } catch {
     }
     c(h, m);
   }, d;
 }
-class Sn extends z({
+class gr extends B({
   registry: u.const(),
   daemonModel: u.const(),
   reportModel: u.const()
 }) {
   constructor() {
     super(...arguments);
-    l(this, "leftSidebarVisible", te(this, {
+    l(this, "leftSidebarVisible", Q(this, {
       storageKey: "component-explorer:leftSidebarVisible",
       defaultValue: !0
     }));
-    l(this, "rightSidebarVisible", te(this, {
+    l(this, "rightSidebarVisible", Q(this, {
       storageKey: "component-explorer:rightSidebarVisible",
       defaultValue: !1
     }));
-    l(this, "isDarkTheme", te(this, {
+    l(this, "isDarkTheme", Q(this, {
       storageKey: "component-explorer:isDarkTheme",
       defaultValue: !0
     }));
-    l(this, "selectedNodeId", te(this, {
+    l(this, "selectedNodeId", Q(this, {
       storageKey: "component-explorer:selectedNodeId",
       defaultValue: void 0
     }));
-    l(this, "expandedNodeIds", x(this, /* @__PURE__ */ new Set([""])));
-    l(this, "viewMode", te(this, {
+    l(this, "expandedNodeIds", w(this, /* @__PURE__ */ new Set([""])));
+    l(this, "viewMode", Q(this, {
       storageKey: "component-explorer:viewMode",
       defaultValue: "session"
     }));
     /** The explorer's tree derived from the registry or report */
-    l(this, "tree", F(this, (t) => {
+    l(this, "tree", D(this, (t) => {
       const n = this.props.reportModel;
       if (n)
         return n.buildTree(t);
-      const r = this.props.registry.root.read(t);
-      return ht(r);
+      const s = this.props.registry.root.read(t);
+      return ot(s);
     }));
-    l(this, "selectedNode", F(this, (t) => {
+    l(this, "selectedNode", D(this, (t) => {
       const n = this.selectedNodeId.read(t);
       if (n === void 0) return;
-      const r = this.tree.read(t);
-      return r.id === n ? r : this._findNode(r.children ?? [], n);
+      const s = this.tree.read(t);
+      return s.id === n ? s : this._findNode(s.children ?? [], n);
     }));
     /** List of preview rows to render based on current selection and view mode */
-    l(this, "selectedFixtures", F(this, (t) => {
+    l(this, "selectedFixtures", D(this, (t) => {
       const n = this.selectedNode.read(t);
-      return n ? this.isReportMode ? (this.props.reportModel.state.read(t), this._collectReportRows(n, n.name)) : this.viewMode.read(t) === "diff" && this.daemonAvailable ? this._collectDiffRows(n, n.name) : this._collectPreviewRows(n, n.name) : [];
+      return n ? this.isReportMode ? (this.props.reportModel.state.read(t), this._collectReportRows(n, n.name)) : this.viewMode.read(t) === "diff" && this.daemonAvailable && this.daemon.sessions.read(t).length > 1 ? this._collectDiffRows(n, n.name) : this._collectPreviewRows(n, n.name) : [];
     }));
     l(this, "setViewMode", (t) => {
       this.viewMode.set(t, void 0);
@@ -2075,8 +1707,8 @@ class Sn extends z({
     l(this, "navigateToSession", (t) => {
       const n = this.props.daemonModel;
       if (!n) return;
-      const r = n.getSessionExplorerUrl(t);
-      r && (window.location.href = r);
+      const s = n.getSessionExplorerUrl(t);
+      s && (window.location.href = s);
     });
     l(this, "toggleLeftSidebar", () => {
       this.leftSidebarVisible.set(!this.leftSidebarVisible.get(), void 0);
@@ -2091,8 +1723,8 @@ class Sn extends z({
       this.selectedNodeId.set(t, void 0);
     });
     l(this, "toggleNodeExpanded", (t) => {
-      const n = this.expandedNodeIds.get(), r = new Set(n);
-      r.has(t) ? r.delete(t) : r.add(t), this.expandedNodeIds.set(r, void 0);
+      const n = this.expandedNodeIds.get(), s = new Set(n);
+      s.has(t) ? s.delete(t) : s.add(t), this.expandedNodeIds.set(s, void 0);
     });
   }
   get daemonAvailable() {
@@ -2111,11 +1743,11 @@ class Sn extends z({
     return this.expandedNodeIds.read(n).has(t);
   }
   _findNode(t, n) {
-    for (const r of t) {
-      if (r.id === n) return r;
-      if (r.children) {
-        const i = this._findNode(r.children, n);
-        if (i) return i;
+    for (const s of t) {
+      if (s.id === n) return s;
+      if (s.children) {
+        const o = this._findNode(s.children, n);
+        if (o) return o;
       }
     }
   }
@@ -2131,28 +1763,28 @@ class Sn extends z({
         }
       }];
     if (t.type === "variants") {
-      const i = [];
-      for (const o of t.children ?? [])
-        o.type === "component" && o.component && i.push({
-          id: o.id,
-          name: o.name,
-          path: `${n} / ${o.name}`,
-          component: o.component
+      const o = [];
+      for (const i of t.children ?? [])
+        i.type === "component" && i.component && o.push({
+          id: i.id,
+          name: i.name,
+          path: `${n} / ${i.name}`,
+          component: i.component
         });
-      return i.length > 0 ? [{
+      return o.length > 0 ? [{
         type: "variants",
         id: t.id,
         name: t.name,
         path: n,
-        fixtures: i
+        fixtures: o
       }] : [];
     }
-    const r = [];
-    for (const i of t.children ?? []) {
-      const o = n ? `${n} / ${i.name}` : i.name;
-      r.push(...this._collectPreviewRows(i, o));
+    const s = [];
+    for (const o of t.children ?? []) {
+      const i = n ? `${n} / ${o.name}` : o.name;
+      s.push(...this._collectPreviewRows(o, i));
     }
-    return r;
+    return s;
   }
   /**
    * In diff mode: fixtures become screenshot comparison items showing current vs baseline.
@@ -2172,34 +1804,34 @@ class Sn extends z({
         }]
       }];
     if (t.type === "variants") {
-      const i = [];
-      for (const o of t.children ?? [])
-        o.type === "component" && i.push({
-          fixtureId: o.id,
-          name: o.name,
-          path: `${n} / ${o.name}`
+      const o = [];
+      for (const i of t.children ?? [])
+        i.type === "component" && o.push({
+          fixtureId: i.id,
+          name: i.name,
+          path: `${n} / ${i.name}`
         });
-      return i.length > 0 ? [{
+      return o.length > 0 ? [{
         type: "screenshot-comparison",
         id: t.id,
         name: t.name,
         path: n,
-        items: i
+        items: o
       }] : [];
     }
-    const r = [];
-    for (const i of t.children ?? []) {
-      const o = n ? `${n} / ${i.name}` : i.name;
-      r.push(...this._collectDiffRows(i, o));
+    const s = [];
+    for (const o of t.children ?? []) {
+      const i = n ? `${n} / ${o.name}` : o.name;
+      s.push(...this._collectDiffRows(o, i));
     }
-    return r;
+    return s;
   }
   _collectReportRows(t, n) {
-    const r = this.props.reportModel.state.get();
-    if (r.status !== "ready") return [];
-    const i = r.report.fixtures;
+    const s = this.props.reportModel.state.get();
+    if (s.status !== "ready") return [];
+    const o = s.report.fixtures;
     if (t.type === "component") {
-      const d = i[t.id];
+      const d = o[t.id];
       return d ? [{
         type: "report-comparison",
         id: t.id,
@@ -2213,15 +1845,15 @@ class Sn extends z({
         }]
       }] : [];
     }
-    const o = [];
+    const i = [];
     for (const d of t.children ?? []) {
       const c = n ? `${n} / ${d.name}` : d.name;
-      o.push(...this._collectReportRows(d, c));
+      i.push(...this._collectReportRows(d, c));
     }
-    return o;
+    return i;
   }
 }
-const p = {
+const f = {
   container: {
     display: "flex",
     flexDirection: "row",
@@ -2410,15 +2042,15 @@ const p = {
     cursor: "pointer"
   }
 };
-function Te(...s) {
-  return Object.assign({}, ...s.filter(Boolean));
+function Se(...r) {
+  return Object.assign({}, ...r.filter(Boolean));
 }
-class wn extends z({
+class mr extends B({
   active: u()
 }) {
   constructor() {
     super(...arguments);
-    l(this, "isHovered", x(this, !1));
+    l(this, "isHovered", w(this, !1));
     l(this, "setHovered", (t) => {
       this.isHovered.set(t, void 0);
     });
@@ -2427,23 +2059,23 @@ class wn extends z({
     return this.props.active;
   }
 }
-const ce = $(
-  wn,
+const oe = A(
+  mr,
   {
     onClick: u.const(),
     title: u.const(),
     children: u.const()
   },
-  (s, e, t) => {
-    const n = e.isHovered.read(s), r = e.active.read(s), i = Te(
-      p.titleBarButton,
-      n && !r && p.titleBarButtonHover,
-      r && p.titleBarButtonActive
+  (r, e, t) => {
+    const n = e.isHovered.read(r), s = e.active.read(r), o = Se(
+      f.titleBarButton,
+      n && !s && f.titleBarButtonHover,
+      s && f.titleBarButtonActive
     );
     return /* @__PURE__ */ a(
       "button",
       {
-        style: i,
+        style: o,
         onClick: t.onClick,
         title: t.title,
         onMouseEnter: () => e.setHovered(!0),
@@ -2452,20 +2084,20 @@ const ce = $(
       }
     );
   }
-), In = ({ style: s }) => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", style: s, children: /* @__PURE__ */ a("path", { d: "M5.7 13.7L5 13l4.6-4.6L5 3.7l.7-.7 5.3 5.4-5.3 5.3z" }) }), On = ({ style: s }) => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", style: s, children: /* @__PURE__ */ a("path", { d: "M11 5.5L6 10.5L5.3 9.8L9.6 5.5L5.3 1.2L6 0.5L11 5.5z", transform: "rotate(90 8 5.5)" }) }), Rn = ({ style: s }) => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", style: s, children: /* @__PURE__ */ a("path", { d: "M14.5 2H9l-.35.15-.65.64-.65-.64L7 2H1.5l-.5.5v10l.5.5H7l.35-.15.65-.64.65.64.35.15h5.5l.5-.5v-10l-.5-.5zm-7 10H2V3h5v.86L5.85 5l1.15 1.14V10l-1.15-1.14L7 7.72V12zm6 0H8V7.72l1.15 1.14L8 10V6.14L9.15 5 8 3.86V3h5v9z" }) }), Tn = ({ style: s }) => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", style: s, children: /* @__PURE__ */ a("path", { d: "M14.5 3H7.71l-.85-.85L6.5 2h-5l-.5.5v11l.5.5h13l.5-.5v-10l-.5-.5zm-.5 10H2V6h12v7zm0-8H2V3h4.29l.85.85.36.15H14v1z" }) }), kn = () => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ a("path", { d: "M2 2v12h12V2H2zm11 11H6V3h7v10zM3 3h2v10H3V3z" }) }), Vn = () => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ a("path", { d: "M2 2v12h12V2H2zm6 11V3h5v10H8zM3 3h4v10H3V3z" }) }), Nn = () => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ a("path", { d: "M8 11a3 3 0 1 1 0-6 3 3 0 0 1 0 6zm0 1a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM8 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 0zm0 13a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 13zm8-5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2a.5.5 0 0 1 .5.5zM3 8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2A.5.5 0 0 1 3 8zm10.657-5.657a.5.5 0 0 1 0 .707l-1.414 1.415a.5.5 0 1 1-.707-.708l1.414-1.414a.5.5 0 0 1 .707 0zm-9.193 9.193a.5.5 0 0 1 0 .707L3.05 13.657a.5.5 0 0 1-.707-.707l1.414-1.414a.5.5 0 0 1 .707 0zm9.193 2.121a.5.5 0 0 1-.707 0l-1.414-1.414a.5.5 0 0 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .707zM4.464 4.465a.5.5 0 0 1-.707 0L2.343 3.05a.5.5 0 1 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .708z" }) }), Dn = () => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ a("path", { d: "M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278z" }) }), Mn = k(
+), vr = ({ style: r }) => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", style: r, children: /* @__PURE__ */ a("path", { d: "M5.7 13.7L5 13l4.6-4.6L5 3.7l.7-.7 5.3 5.4-5.3 5.3z" }) }), _r = ({ style: r }) => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", style: r, children: /* @__PURE__ */ a("path", { d: "M11 5.5L6 10.5L5.3 9.8L9.6 5.5L5.3 1.2L6 0.5L11 5.5z", transform: "rotate(90 8 5.5)" }) }), br = ({ style: r }) => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", style: r, children: /* @__PURE__ */ a("path", { d: "M14.5 2H9l-.35.15-.65.64-.65-.64L7 2H1.5l-.5.5v10l.5.5H7l.35-.15.65-.64.65.64.35.15h5.5l.5-.5v-10l-.5-.5zm-7 10H2V3h5v.86L5.85 5l1.15 1.14V10l-1.15-1.14L7 7.72V12zm6 0H8V7.72l1.15 1.14L8 10V6.14L9.15 5 8 3.86V3h5v9z" }) }), yr = ({ style: r }) => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", style: r, children: /* @__PURE__ */ a("path", { d: "M14.5 3H7.71l-.85-.85L6.5 2h-5l-.5.5v11l.5.5h13l.5-.5v-10l-.5-.5zm-.5 10H2V6h12v7zm0-8H2V3h4.29l.85.85.36.15H14v1z" }) }), xr = () => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ a("path", { d: "M2 2v12h12V2H2zm11 11H6V3h7v10zM3 3h2v10H3V3z" }) }), Cr = () => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ a("path", { d: "M2 2v12h12V2H2zm6 11V3h5v10H8zM3 3h4v10H3V3z" }) }), Sr = () => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ a("path", { d: "M8 11a3 3 0 1 1 0-6 3 3 0 0 1 0 6zm0 1a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM8 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 0zm0 13a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 13zm8-5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2a.5.5 0 0 1 .5.5zM3 8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2A.5.5 0 0 1 3 8zm10.657-5.657a.5.5 0 0 1 0 .707l-1.414 1.415a.5.5 0 1 1-.707-.708l1.414-1.414a.5.5 0 0 1 .707 0zm-9.193 9.193a.5.5 0 0 1 0 .707L3.05 13.657a.5.5 0 0 1-.707-.707l1.414-1.414a.5.5 0 0 1 .707 0zm9.193 2.121a.5.5 0 0 1-.707 0l-1.414-1.414a.5.5 0 0 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .707zM4.464 4.465a.5.5 0 0 1-.707 0L2.343 3.05a.5.5 0 1 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .708z" }) }), wr = () => /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ a("path", { d: "M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278z" }) }), Rr = V(
   { model: u.const() },
-  (s, e) => {
+  (r, e) => {
     var d, c;
-    const t = e.model, n = t.viewMode.read(s), r = ((d = t.daemon) == null ? void 0 : d.sessions.read(s)) ?? [], i = (c = t.daemon) == null ? void 0 : c.sessionName, o = r.filter((h) => h.name !== i);
-    return /* @__PURE__ */ f("div", { style: X.container, children: [
-      /* @__PURE__ */ f("div", { style: X.segmentedControl, children: [
-        /* @__PURE__ */ a(Le, { label: "Live", mode: "session", active: n === "session", onClick: () => t.setViewMode("session") }),
-        /* @__PURE__ */ a(Le, { label: "Diff", mode: "diff", active: n === "diff", onClick: () => t.setViewMode("diff") })
+    const t = e.model, n = t.viewMode.read(r), s = ((d = t.daemon) == null ? void 0 : d.sessions.read(r)) ?? [], o = (c = t.daemon) == null ? void 0 : c.sessionName, i = s.filter((h) => h.name !== o);
+    return s.length <= 1 ? null : /* @__PURE__ */ p("div", { style: J.container, children: [
+      /* @__PURE__ */ p("div", { style: J.segmentedControl, children: [
+        /* @__PURE__ */ a(Be, { label: "Live", mode: "session", active: n === "session", onClick: () => t.setViewMode("session") }),
+        /* @__PURE__ */ a(Be, { label: "Diff", mode: "diff", active: n === "diff", onClick: () => t.setViewMode("diff") })
       ] }),
-      o.length > 0 && /* @__PURE__ */ a("div", { style: X.sessionLinks, children: o.map((h) => /* @__PURE__ */ f(
+      i.length > 0 && /* @__PURE__ */ a("div", { style: J.sessionLinks, children: i.map((h) => /* @__PURE__ */ p(
         "button",
         {
-          style: X.sessionLink,
+          style: J.sessionLink,
           onClick: () => t.navigateToSession(h.name),
           title: `Switch to ${h.name} session`,
           children: [
@@ -2478,63 +2110,63 @@ const ce = $(
     ] });
   }
 );
-function Le({ label: s, mode: e, active: t, onClick: n }) {
+function Be({ label: r, mode: e, active: t, onClick: n }) {
   return /* @__PURE__ */ a(
     "button",
     {
-      style: t ? X.segmentActive : X.segment,
+      style: t ? J.segmentActive : J.segment,
       onClick: n,
-      children: s
+      children: r
     }
   );
 }
-const Fn = k(
+const Tr = V(
   {
     model: u.const()
   },
-  (s, e) => {
-    const t = e.model, n = t.leftSidebarVisible.read(s), r = t.rightSidebarVisible.read(s), i = t.isDarkTheme.read(s), o = t.selectedNode.read(s);
-    return /* @__PURE__ */ f("div", { style: p.titleBar, children: [
-      /* @__PURE__ */ a("div", { style: p.titleBarSection, children: /* @__PURE__ */ a(
-        ce,
+  (r, e) => {
+    const t = e.model, n = t.leftSidebarVisible.read(r), s = t.rightSidebarVisible.read(r), o = t.isDarkTheme.read(r), i = t.selectedNode.read(r);
+    return /* @__PURE__ */ p("div", { style: f.titleBar, children: [
+      /* @__PURE__ */ a("div", { style: f.titleBarSection, children: /* @__PURE__ */ a(
+        oe,
         {
           active: n,
           onClick: t.toggleLeftSidebar,
           title: "Toggle left sidebar",
-          children: /* @__PURE__ */ a(kn, {})
+          children: /* @__PURE__ */ a(xr, {})
         }
       ) }),
-      /* @__PURE__ */ f("div", { style: p.titleBarCenter, children: [
-        t.isReportMode ? /* @__PURE__ */ a("span", { style: { fontSize: 12, color: "var(--vscode-descriptionForeground)" }, children: "Screenshot Report" }) : t.daemonAvailable ? /* @__PURE__ */ a(Mn, { model: t }) : null,
-        o ? /* @__PURE__ */ f(ye, { children: [
+      /* @__PURE__ */ p("div", { style: f.titleBarCenter, children: [
+        t.isReportMode ? /* @__PURE__ */ a("span", { style: { fontSize: 12, color: "var(--vscode-descriptionForeground)" }, children: "Screenshot Report" }) : t.daemonAvailable ? /* @__PURE__ */ a(Rr, { model: t }) : null,
+        i ? /* @__PURE__ */ p(ge, { children: [
           /* @__PURE__ */ a("span", { style: { color: "var(--vscode-textLink-foreground)" }, children: "<" }),
-          /* @__PURE__ */ a("span", { children: o.name }),
+          /* @__PURE__ */ a("span", { children: i.name }),
           /* @__PURE__ */ a("span", { style: { color: "var(--vscode-textLink-foreground)" }, children: "/>" })
         ] }) : /* @__PURE__ */ a("span", { style: { color: "var(--vscode-descriptionForeground)" }, children: "No component selected" })
       ] }),
-      /* @__PURE__ */ f("div", { style: p.titleBarSection, children: [
+      /* @__PURE__ */ p("div", { style: f.titleBarSection, children: [
         /* @__PURE__ */ a(
-          ce,
+          oe,
           {
             active: !1,
             onClick: t.toggleTheme,
-            title: i ? "Switch to light theme" : "Switch to dark theme",
-            children: i ? /* @__PURE__ */ a(Nn, {}) : /* @__PURE__ */ a(Dn, {})
+            title: o ? "Switch to light theme" : "Switch to dark theme",
+            children: o ? /* @__PURE__ */ a(Sr, {}) : /* @__PURE__ */ a(wr, {})
           }
         ),
         /* @__PURE__ */ a(
-          ce,
+          oe,
           {
-            active: r,
+            active: s,
             onClick: t.toggleRightSidebar,
             title: "Toggle right sidebar",
-            children: /* @__PURE__ */ a(Vn, {})
+            children: /* @__PURE__ */ a(Cr, {})
           }
         )
       ] })
     ] });
   }
-), X = {
+), J = {
   container: {
     display: "flex",
     alignItems: "center",
@@ -2578,22 +2210,22 @@ const Fn = k(
     color: "var(--vscode-textLink-foreground)",
     cursor: "pointer"
   }
-}, ut = k(
+}, it = V(
   {
     model: u.const(),
     nodes: u.const(),
     depth: u.const()
   },
-  (s, e) => /* @__PURE__ */ a(ye, { children: e.nodes.map((t) => /* @__PURE__ */ a(An, { model: e.model, node: t, depth: e.depth }, t.id)) })
+  (r, e) => /* @__PURE__ */ a(ge, { children: e.nodes.map((t) => /* @__PURE__ */ a(Or, { model: e.model, node: t, depth: e.depth }, t.id)) })
 );
-class En extends z({
+class Ir extends B({
   model: u.const(),
   node: u.const(),
   depth: u.const()
 }) {
   constructor() {
     super(...arguments);
-    l(this, "isHovered", x(this, !1));
+    l(this, "isHovered", w(this, !1));
     l(this, "setHovered", (t) => {
       this.isHovered.set(t, void 0);
     });
@@ -2621,15 +2253,15 @@ class En extends z({
     return !!(this.props.node.children && this.props.node.children.length > 0);
   }
 }
-const An = $(En, {}, (s, e) => {
-  const t = e.explorerModel, n = e.treeNode, r = e.treeDepth, i = !!(n.children && n.children.length > 0), o = i ? t.isNodeExpanded(n.id, s) : !1, c = t.selectedNodeId.read(s) === n.id, h = e.isHovered.read(s), m = Te(
-    p.treeItem,
-    { paddingLeft: `${8 + r * 12}px` },
-    c && p.treeItemSelected,
-    !c && h && p.treeItemHover
+const Or = A(Ir, {}, (r, e) => {
+  const t = e.explorerModel, n = e.treeNode, s = e.treeDepth, o = !!(n.children && n.children.length > 0), i = o ? t.isNodeExpanded(n.id, r) : !1, c = t.selectedNodeId.read(r) === n.id, h = e.isHovered.read(r), m = Se(
+    f.treeItem,
+    { paddingLeft: `${8 + s * 12}px` },
+    c && f.treeItemSelected,
+    !c && h && f.treeItemHover
   );
-  return /* @__PURE__ */ f(ye, { children: [
-    /* @__PURE__ */ f(
+  return /* @__PURE__ */ p(ge, { children: [
+    /* @__PURE__ */ p(
       "div",
       {
         style: m,
@@ -2638,38 +2270,38 @@ const An = $(En, {}, (s, e) => {
         onMouseEnter: () => e.setHovered(!0),
         onMouseLeave: () => e.setHovered(!1),
         children: [
-          i ? /* @__PURE__ */ a("div", { style: p.treeItemChevron, onClick: e.handleChevronClick, children: o ? /* @__PURE__ */ a(On, {}) : /* @__PURE__ */ a(In, {}) }) : /* @__PURE__ */ a("div", { style: p.treeItemChevronPlaceholder }),
-          /* @__PURE__ */ a("div", { style: p.treeItemIcon, children: n.type === "folder" ? /* @__PURE__ */ a(Tn, { style: { color: "var(--vscode-symbolIcon-folderForeground)" } }) : /* @__PURE__ */ a(Rn, { style: { color: "#deb45b" } }) }),
-          /* @__PURE__ */ a("span", { style: p.treeItemLabel, children: n.name }),
-          i && /* @__PURE__ */ a("span", { style: p.treeItemCount, children: n.children.length })
+          o ? /* @__PURE__ */ a("div", { style: f.treeItemChevron, onClick: e.handleChevronClick, children: i ? /* @__PURE__ */ a(_r, {}) : /* @__PURE__ */ a(vr, {}) }) : /* @__PURE__ */ a("div", { style: f.treeItemChevronPlaceholder }),
+          /* @__PURE__ */ a("div", { style: f.treeItemIcon, children: n.type === "folder" ? /* @__PURE__ */ a(yr, { style: { color: "var(--vscode-symbolIcon-folderForeground)" } }) : /* @__PURE__ */ a(br, { style: { color: "#deb45b" } }) }),
+          /* @__PURE__ */ a("span", { style: f.treeItemLabel, children: n.name }),
+          o && /* @__PURE__ */ a("span", { style: f.treeItemCount, children: n.children.length })
         ]
       }
     ),
-    i && o && /* @__PURE__ */ a(ut, { model: t, nodes: n.children, depth: r + 1 })
+    o && i && /* @__PURE__ */ a(it, { model: t, nodes: n.children, depth: s + 1 })
   ] });
-}), Bn = k(
+}), kr = V(
   {
     model: u.const()
   },
-  (s, e) => {
-    const t = e.model.tree.read(s);
-    return /* @__PURE__ */ f("div", { style: p.sidebar, children: [
-      /* @__PURE__ */ a("div", { style: p.sidebarHeader, children: "Explorer" }),
-      /* @__PURE__ */ a("div", { style: p.sidebarContent, children: /* @__PURE__ */ a(ut, { model: e.model, nodes: [t], depth: 0 }) })
+  (r, e) => {
+    const t = e.model.tree.read(r);
+    return /* @__PURE__ */ p("div", { style: f.sidebar, children: [
+      /* @__PURE__ */ a("div", { style: f.sidebarHeader, children: "Explorer" }),
+      /* @__PURE__ */ a("div", { style: f.sidebarContent, children: /* @__PURE__ */ a(it, { model: e.model, nodes: [t], depth: 0 }) })
     ] });
   }
 );
-class zn extends z({}) {
+class Vr extends B({}) {
   constructor() {
     super(...arguments);
-    l(this, "checked", x(this, !1));
+    l(this, "checked", w(this, !1));
     l(this, "toggle", () => {
       this.checked.set(!this.checked.get(), void 0);
     });
   }
 }
-const $n = $(zn, {}, (s, e) => {
-  const t = e.checked.read(s), n = {
+const Nr = A(Vr, {}, (r, e) => {
+  const t = e.checked.read(r), n = {
     position: "relative",
     width: "36px",
     height: "18px",
@@ -2678,7 +2310,7 @@ const $n = $(zn, {}, (s, e) => {
     cursor: "pointer",
     transition: "background-color 0.2s",
     border: "1px solid var(--vscode-input-border, transparent)"
-  }, r = {
+  }, s = {
     position: "absolute",
     top: "2px",
     left: t ? "18px" : "2px",
@@ -2688,14 +2320,14 @@ const $n = $(zn, {}, (s, e) => {
     borderRadius: "50%",
     transition: "left 0.2s"
   };
-  return /* @__PURE__ */ a("div", { style: n, onClick: e.toggle, children: /* @__PURE__ */ a("div", { style: r }) });
-}), Hn = k(
+  return /* @__PURE__ */ a("div", { style: n, onClick: e.toggle, children: /* @__PURE__ */ a("div", { style: s }) });
+}), Mr = V(
   {
     node: u.const()
   },
-  (s, e) => e.node.type !== "component" ? /* @__PURE__ */ a("div", { style: { padding: "12px", color: "var(--vscode-descriptionForeground)", fontSize: "12px" }, children: "Select a component (not a folder) to view its properties" }) : /* @__PURE__ */ f("div", { style: p.propertiesPanel, children: [
-    /* @__PURE__ */ f("div", { style: p.propertyRow, children: [
-      /* @__PURE__ */ f("div", { style: p.propertyLabel, children: [
+  (r, e) => e.node.type !== "component" ? /* @__PURE__ */ a("div", { style: { padding: "12px", color: "var(--vscode-descriptionForeground)", fontSize: "12px" }, children: "Select a component (not a folder) to view its properties" }) : /* @__PURE__ */ p("div", { style: f.propertiesPanel, children: [
+    /* @__PURE__ */ p("div", { style: f.propertyRow, children: [
+      /* @__PURE__ */ p("div", { style: f.propertyLabel, children: [
         "children",
         /* @__PURE__ */ a("span", { style: { color: "var(--vscode-descriptionForeground)" }, children: " : string" })
       ] }),
@@ -2703,60 +2335,60 @@ const $n = $(zn, {}, (s, e) => {
         "input",
         {
           type: "text",
-          style: p.propertyInput,
+          style: f.propertyInput,
           defaultValue: "Click me",
           placeholder: "Enter text..."
         }
       ),
-      /* @__PURE__ */ a("div", { style: p.propertyDescription, children: "Button text content" })
+      /* @__PURE__ */ a("div", { style: f.propertyDescription, children: "Button text content" })
     ] }),
-    /* @__PURE__ */ f("div", { style: p.propertyRow, children: [
-      /* @__PURE__ */ f("div", { style: p.propertyLabel, children: [
+    /* @__PURE__ */ p("div", { style: f.propertyRow, children: [
+      /* @__PURE__ */ p("div", { style: f.propertyLabel, children: [
         "variant",
         /* @__PURE__ */ a("span", { style: { color: "var(--vscode-descriptionForeground)" }, children: " : select" })
       ] }),
-      /* @__PURE__ */ f("select", { style: p.propertySelect, defaultValue: "default", children: [
+      /* @__PURE__ */ p("select", { style: f.propertySelect, defaultValue: "default", children: [
         /* @__PURE__ */ a("option", { value: "default", children: "default" }),
         /* @__PURE__ */ a("option", { value: "primary", children: "primary" }),
         /* @__PURE__ */ a("option", { value: "secondary", children: "secondary" }),
         /* @__PURE__ */ a("option", { value: "destructive", children: "destructive" })
       ] }),
-      /* @__PURE__ */ a("div", { style: p.propertyDescription, children: "Visual style variant" })
+      /* @__PURE__ */ a("div", { style: f.propertyDescription, children: "Visual style variant" })
     ] }),
-    /* @__PURE__ */ f("div", { style: p.propertyRow, children: [
-      /* @__PURE__ */ f("div", { style: p.propertyLabel, children: [
+    /* @__PURE__ */ p("div", { style: f.propertyRow, children: [
+      /* @__PURE__ */ p("div", { style: f.propertyLabel, children: [
         "size",
         /* @__PURE__ */ a("span", { style: { color: "var(--vscode-descriptionForeground)" }, children: " : select" })
       ] }),
-      /* @__PURE__ */ f("select", { style: p.propertySelect, defaultValue: "default", children: [
+      /* @__PURE__ */ p("select", { style: f.propertySelect, defaultValue: "default", children: [
         /* @__PURE__ */ a("option", { value: "sm", children: "sm" }),
         /* @__PURE__ */ a("option", { value: "default", children: "default" }),
         /* @__PURE__ */ a("option", { value: "lg", children: "lg" })
       ] }),
-      /* @__PURE__ */ a("div", { style: p.propertyDescription, children: "Button size" })
+      /* @__PURE__ */ a("div", { style: f.propertyDescription, children: "Button size" })
     ] }),
-    /* @__PURE__ */ f("div", { style: p.propertyRow, children: [
-      /* @__PURE__ */ f("div", { style: p.propertyLabel, children: [
+    /* @__PURE__ */ p("div", { style: f.propertyRow, children: [
+      /* @__PURE__ */ p("div", { style: f.propertyLabel, children: [
         "disabled",
         /* @__PURE__ */ a("span", { style: { color: "var(--vscode-descriptionForeground)" }, children: " : boolean" })
       ] }),
-      /* @__PURE__ */ a($n, {}),
-      /* @__PURE__ */ a("div", { style: p.propertyDescription, children: "Disable the button" })
+      /* @__PURE__ */ a(Nr, {}),
+      /* @__PURE__ */ a("div", { style: f.propertyDescription, children: "Disable the button" })
     ] })
   ] })
-), Ln = k(
+), Dr = V(
   {
     selectedNode: u.const()
   },
-  (s, e) => /* @__PURE__ */ f("div", { style: Te(p.sidebar, p.sidebarRight), children: [
-    /* @__PURE__ */ f("div", { style: p.sidebarHeader, children: [
+  (r, e) => /* @__PURE__ */ p("div", { style: Se(f.sidebar, f.sidebarRight), children: [
+    /* @__PURE__ */ p("div", { style: f.sidebarHeader, children: [
       /* @__PURE__ */ a("span", { style: { marginRight: "6px", color: "var(--vscode-textLink-foreground)" }, children: "</>" }),
       "Props"
     ] }),
-    /* @__PURE__ */ a("div", { style: p.sidebarContent, children: e.selectedNode ? /* @__PURE__ */ a(Hn, { node: e.selectedNode }) : /* @__PURE__ */ a("div", { style: { padding: "12px", color: "var(--vscode-descriptionForeground)", fontSize: "12px" }, children: "Select a component to view its properties" }) })
+    /* @__PURE__ */ a("div", { style: f.sidebarContent, children: e.selectedNode ? /* @__PURE__ */ a(Mr, { node: e.selectedNode }) : /* @__PURE__ */ a("div", { style: { padding: "12px", color: "var(--vscode-descriptionForeground)", fontSize: "12px" }, children: "Select a component to view its properties" }) })
   ] })
 );
-class Un extends z({
+class Fr extends B({
   fixture: u.const(),
   compact: u.const()
 }) {
@@ -2765,21 +2397,22 @@ class Un extends z({
     l(this, "_containerRef", null);
     l(this, "_shadowRoot", null);
     l(this, "_renderContainer", null);
-    l(this, "_disposable", null);
+    l(this, "_renderResult", null);
+    l(this, "_abortController", null);
     l(this, "_resizeObserver", null);
-    l(this, "measuredWidth", x(this, void 0));
-    l(this, "measuredHeight", x(this, void 0));
+    l(this, "measuredWidth", w(this, void 0));
+    l(this, "measuredHeight", w(this, void 0));
     l(this, "setContainerRef", (t) => {
       if (t === this._containerRef || (this._cleanup(), this._containerRef = t, !t)) return;
       const n = this.fixture.component;
       n.isolation === "shadow-dom" ? this._renderInShadowDom(t, n) : this._renderDirect(t, n);
-      const r = this._renderContainer ?? t;
-      this._resizeObserver = new ResizeObserver((i) => {
-        for (const o of i) {
-          const { width: d, height: c } = o.contentRect;
+      const s = this._renderContainer ?? t;
+      this._resizeObserver = new ResizeObserver((o) => {
+        for (const i of o) {
+          const { width: d, height: c } = i.contentRect;
           c > 0 && (this.measuredWidth.set(Math.round(d), void 0), this.measuredHeight.set(Math.round(c), void 0));
         }
-      }), this._resizeObserver.observe(r);
+      }), this._resizeObserver.observe(s);
     });
   }
   get fixture() {
@@ -2796,69 +2429,81 @@ class Un extends z({
     } else
       this._shadowRoot = t.attachShadow({ mode: "open" });
     if (n.styles)
-      for (const o of n.styles)
-        if (o.type === "css") {
+      for (const i of n.styles)
+        if (i.type === "css") {
           const d = document.createElement("style");
-          d.textContent = o.content, this._shadowRoot.appendChild(d);
-        } else if (o.type === "url") {
+          d.textContent = i.content, this._shadowRoot.appendChild(d);
+        } else if (i.type === "url") {
           const d = document.createElement("link");
-          d.rel = "stylesheet", d.href = o.href, this._shadowRoot.appendChild(d);
-        } else o.type === "adopted" && (this._shadowRoot.adoptedStyleSheets = [
+          d.rel = "stylesheet", d.href = i.href, this._shadowRoot.appendChild(d);
+        } else i.type === "adopted" && (this._shadowRoot.adoptedStyleSheets = [
           ...this._shadowRoot.adoptedStyleSheets,
-          o.sheet
+          i.sheet
         ]);
-    const r = document.createElement("div");
-    r.style.display = "inline-block", this._renderContainer = r, this._shadowRoot.appendChild(r);
-    const i = this._getDefaultProps(n);
-    this._disposable = n.render(r, i);
+    const s = document.createElement("div");
+    s.style.display = "inline-block", this._renderContainer = s, this._shadowRoot.appendChild(s);
+    const o = this._getDefaultProps(n);
+    this._abortController = new AbortController(), this._handleRenderReturn(n.render(s, {
+      props: o,
+      signal: this._abortController.signal
+    }));
   }
   _renderDirect(t, n) {
     this._renderContainer = t;
-    const r = this._getDefaultProps(n);
-    this._disposable = n.render(t, r);
+    const s = this._getDefaultProps(n);
+    this._abortController = new AbortController(), this._handleRenderReturn(n.render(t, {
+      props: s,
+      signal: this._abortController.signal
+    }));
+  }
+  _handleRenderReturn(t) {
+    t instanceof Promise ? t.then((n) => {
+      this._abortController && !this._abortController.signal.aborted && (this._renderResult = n ?? void 0);
+    }).catch(() => {
+    }) : this._renderResult = t ?? void 0;
   }
   _getDefaultProps(t) {
     const n = {};
-    for (const r of t.properties)
-      n[r.name] = r.defaultValue;
+    for (const s of t.properties)
+      n[s.name] = s.defaultValue;
     return n;
   }
   _cleanup() {
-    var t;
-    this._disposable && (typeof this._disposable == "function" ? this._disposable() : typeof this._disposable.dispose == "function" && this._disposable.dispose()), this._disposable = null, (t = this._resizeObserver) == null || t.disconnect(), this._resizeObserver = null, this._shadowRoot = null, this._renderContainer = null;
+    var t, n;
+    this._abortController && (this._abortController.abort(), this._abortController = null), (t = this._renderResult) != null && t.dispose && this._renderResult.dispose(), this._renderResult = null, (n = this._resizeObserver) == null || n.disconnect(), this._resizeObserver = null, this._shadowRoot = null, this._renderContainer = null;
   }
   dispose() {
     this._cleanup();
   }
 }
-const ft = $(
-  Un,
+const at = A(
+  Fr,
   {},
-  (s, e) => {
-    const t = e.fixture, n = t.component, r = n.displayMode, i = e.measuredWidth.read(s), o = e.measuredHeight.read(s), d = e.compact;
+  (r, e) => {
+    const t = e.fixture, n = t.component, s = n.displayMode, o = e.measuredWidth.read(r), i = e.measuredHeight.read(r), d = e.compact;
     let c;
-    if (r.type === "page") {
-      const g = r.viewports[0], v = Nt(g);
+    if (s.type === "page") {
+      const R = s.viewports[0], g = wt(R);
       c = {
-        width: v.width,
-        height: v.height,
+        width: g.width,
+        height: g.height,
         overflow: "auto"
       };
     } else
       c = {
         display: "inline-block"
       };
-    const h = i && o ? `${i} × ${o}` : "", m = d ? K.wrapperCompact : K.wrapper, _ = d ? K.nameCompact : K.name;
-    return /* @__PURE__ */ f("div", { style: m, children: [
-      /* @__PURE__ */ f("div", { style: K.labelRow, children: [
-        /* @__PURE__ */ a("span", { style: _, children: t.name }),
-        !d && h && /* @__PURE__ */ a("span", { style: K.dimensions, children: h })
+    const h = o && i ? `${o} × ${i}` : "", m = d ? G.wrapperCompact : G.wrapper, v = d ? G.nameCompact : G.name;
+    return /* @__PURE__ */ p("div", { style: m, children: [
+      /* @__PURE__ */ p("div", { style: G.labelRow, children: [
+        /* @__PURE__ */ a("span", { style: v, children: t.name }),
+        !d && h && /* @__PURE__ */ a("span", { style: G.dimensions, children: h })
       ] }),
-      /* @__PURE__ */ a("div", { style: Wn(n.background), children: /* @__PURE__ */ a("div", { ref: e.setContainerRef, style: c }) })
+      /* @__PURE__ */ a("div", { style: zr(n.background), children: /* @__PURE__ */ a("div", { ref: e.setContainerRef, style: c }) })
     ] });
   }
-), q = 8;
-function pt(s, e) {
+), W = 8;
+function dt(r, e) {
   return `
     linear-gradient(45deg, ${e} 25%, transparent 25%),
     linear-gradient(-45deg, ${e} 25%, transparent 25%),
@@ -2866,29 +2511,31 @@ function pt(s, e) {
     linear-gradient(-45deg, transparent 75%, ${e} 75%)
   `;
 }
-const jn = {
+const Er = {
   backgroundColor: "#ffffff",
-  backgroundImage: pt("#ffffff", "#e5e5e5")
-}, Pn = {
+  backgroundImage: dt("#ffffff", "#e5e5e5")
+}, Br = {
   backgroundColor: "#1e1e1e",
-  backgroundImage: pt("#1e1e1e", "#2d2d2d")
-}, Gn = {
+  backgroundImage: dt("#1e1e1e", "#2d2d2d")
+}, Ar = {
   display: "inline-block",
   padding: "12px",
   borderRadius: "4px",
-  backgroundSize: `${q * 2}px ${q * 2}px`,
-  backgroundPosition: `0 0, 0 ${q}px, ${q}px -${q}px, -${q}px 0`,
-  boxShadow: "0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.08)"
+  backgroundSize: `${W * 2}px ${W * 2}px`,
+  backgroundPosition: `0 0, 0 ${W}px, ${W}px -${W}px, -${W}px 0`,
+  boxShadow: "0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.08)",
+  overflow: "hidden",
+  position: "relative"
 };
-function Wn(s) {
-  const e = s === "dark" ? Pn : jn;
+function zr(r) {
+  const e = r === "dark" ? Br : Er;
   return {
-    ...Gn,
+    ...Ar,
     backgroundColor: e.backgroundColor,
     backgroundImage: e.backgroundImage
   };
 }
-const K = {
+const G = {
   wrapper: {
     marginBottom: "32px"
   },
@@ -2917,16 +2564,16 @@ const K = {
     fontFamily: "var(--vscode-editor-font-family, monospace)"
   }
 };
-class qn extends z({
+class $r extends B({
   fixtureId: u.const(),
   sessionName: u.const(),
   daemon: u.const()
 }) {
   constructor(t) {
     super(t);
-    l(this, "screenshot", x(this, { status: "idle" }));
+    l(this, "screenshot", w(this, { status: "idle" }));
     l(this, "_fetchVersion", 0);
-    this._store.add(rt((n) => {
+    this._store.add(Qe((n) => {
       this.props.daemon.sourceTreeIds.read(n).get(this.props.sessionName) && this._fetchScreenshot();
     }));
   }
@@ -2944,26 +2591,26 @@ class qn extends z({
     }
   }
 }
-const Ue = $(
-  qn,
+const Ae = A(
+  $r,
   {},
-  (s, e) => {
-    const t = e.screenshot.read(s);
+  (r, e) => {
+    const t = e.screenshot.read(r);
     if (t.status === "idle" || t.status === "loading")
-      return /* @__PURE__ */ a("div", { style: U.placeholder, children: /* @__PURE__ */ a("div", { style: U.shimmer }) });
+      return /* @__PURE__ */ a("div", { style: z.placeholder, children: /* @__PURE__ */ a("div", { style: z.shimmer }) });
     if (t.status === "error")
-      return /* @__PURE__ */ a("div", { style: U.error, children: /* @__PURE__ */ a("span", { style: U.errorText, children: "Screenshot failed" }) });
+      return /* @__PURE__ */ a("div", { style: z.error, children: /* @__PURE__ */ a("span", { style: z.errorText, children: "Screenshot failed" }) });
     const { data: n } = t;
     return n.image ? /* @__PURE__ */ a(
       "img",
       {
         src: `data:image/png;base64,${n.image}`,
-        style: U.image,
+        style: z.image,
         alt: `Screenshot of ${e.fixtureId}`
       }
-    ) : /* @__PURE__ */ a("div", { style: U.placeholder, children: /* @__PURE__ */ a("span", { style: U.hashText, children: n.hash.slice(0, 12) }) });
+    ) : /* @__PURE__ */ a("div", { style: z.placeholder, children: /* @__PURE__ */ a("span", { style: z.hashText, children: n.hash.slice(0, 12) }) });
   }
-), U = {
+), z = {
   placeholder: {
     minHeight: 80,
     display: "flex",
@@ -3006,7 +2653,7 @@ const Ue = $(
     border: "1px solid var(--vscode-panel-border)"
   }
 };
-class Kn extends z({
+class Lr extends B({
   fixtureId: u.const(),
   daemon: u.const(),
   baselineSession: u.const(),
@@ -3014,10 +2661,10 @@ class Kn extends z({
 }) {
   constructor(t) {
     super(t);
-    l(this, "comparisonStatus", x(this, { status: "loading" }));
-    this._store.add(rt((n) => {
-      const r = this.props.daemon.sourceTreeIds.read(n), i = r.get(this.props.baselineSession), o = r.get(this.props.currentSession);
-      i && o && this._fetchComparison();
+    l(this, "comparisonStatus", w(this, { status: "loading" }));
+    this._store.add(Qe((n) => {
+      const s = this.props.daemon.sourceTreeIds.read(n), o = s.get(this.props.baselineSession), i = s.get(this.props.currentSession);
+      o && i && this._fetchComparison();
     }));
   }
   get fixtureId() {
@@ -3046,21 +2693,21 @@ class Kn extends z({
     }
   }
 }
-const Jn = $(
-  Kn,
+const Hr = A(
+  Lr,
   {},
-  (s, e) => {
-    const t = e.comparisonStatus.read(s), n = t.status === "loading" ? /* @__PURE__ */ a("span", { style: C.badgeLoading, children: "comparing..." }) : t.status === "error" ? /* @__PURE__ */ a("span", { style: C.badgeError, children: "error" }) : t.match ? /* @__PURE__ */ a("span", { style: C.badgeMatch, children: "✓ match" }) : /* @__PURE__ */ a("span", { style: C.badgeChanged, children: "● changed" });
-    return /* @__PURE__ */ f("div", { style: C.fixtureRow, children: [
-      /* @__PURE__ */ f("div", { style: C.fixtureLabel, children: [
-        /* @__PURE__ */ a("span", { style: C.fixtureName, children: e.fixtureId }),
+  (r, e) => {
+    const t = e.comparisonStatus.read(r), n = t.status === "loading" ? /* @__PURE__ */ a("span", { style: T.badgeLoading, children: "comparing..." }) : t.status === "error" ? /* @__PURE__ */ a("span", { style: T.badgeError, children: "error" }) : t.match ? /* @__PURE__ */ a("span", { style: T.badgeMatch, children: "✓ match" }) : /* @__PURE__ */ a("span", { style: T.badgeChanged, children: "● changed" });
+    return /* @__PURE__ */ p("div", { style: T.fixtureRow, children: [
+      /* @__PURE__ */ p("div", { style: T.fixtureLabel, children: [
+        /* @__PURE__ */ a("span", { style: T.fixtureName, children: e.fixtureId }),
         n
       ] }),
-      /* @__PURE__ */ f("div", { style: C.sideBySide, children: [
-        /* @__PURE__ */ f("div", { style: C.screenshotColumn, children: [
-          /* @__PURE__ */ a("span", { style: C.columnLabel, children: "Current" }),
+      /* @__PURE__ */ p("div", { style: T.sideBySide, children: [
+        /* @__PURE__ */ p("div", { style: T.screenshotColumn, children: [
+          /* @__PURE__ */ a("span", { style: T.columnLabel, children: "Current" }),
           /* @__PURE__ */ a(
-            Ue,
+            Ae,
             {
               fixtureId: e.fixtureId,
               sessionName: e.currentSession,
@@ -3068,10 +2715,10 @@ const Jn = $(
             }
           )
         ] }),
-        /* @__PURE__ */ f("div", { style: C.screenshotColumn, children: [
-          /* @__PURE__ */ a("span", { style: C.columnLabel, children: "Baseline" }),
+        /* @__PURE__ */ p("div", { style: T.screenshotColumn, children: [
+          /* @__PURE__ */ a("span", { style: T.columnLabel, children: "Baseline" }),
           /* @__PURE__ */ a(
-            Ue,
+            Ae,
             {
               fixtureId: e.fixtureId,
               sessionName: e.baselineSession,
@@ -3082,7 +2729,7 @@ const Jn = $(
       ] })
     ] });
   }
-), Zn = k(
+), jr = V(
   {
     name: u.const(),
     path: u.const(),
@@ -3091,10 +2738,10 @@ const Jn = $(
     baselineSession: u.const(),
     currentSession: u.const()
   },
-  (s, e) => /* @__PURE__ */ f("div", { children: [
-    /* @__PURE__ */ a("div", { style: C.groupHeader, children: /* @__PURE__ */ a("span", { style: C.groupTitle, children: e.path }) }),
-    /* @__PURE__ */ a("div", { style: C.groupContent, children: e.items.map((t) => /* @__PURE__ */ a(
-      Jn,
+  (r, e) => /* @__PURE__ */ p("div", { children: [
+    /* @__PURE__ */ a("div", { style: T.groupHeader, children: /* @__PURE__ */ a("span", { style: T.groupTitle, children: e.path }) }),
+    /* @__PURE__ */ a("div", { style: T.groupContent, children: e.items.map((t) => /* @__PURE__ */ a(
+      Hr,
       {
         fixtureId: t.fixtureId,
         daemon: e.daemon,
@@ -3104,7 +2751,7 @@ const Jn = $(
       t.fixtureId
     )) })
   ] })
-), C = {
+), T = {
   groupHeader: {
     marginBottom: 12
   },
@@ -3172,8 +2819,8 @@ const Jn = $(
     color: "var(--vscode-errorForeground)",
     fontWeight: 500
   }
-}, J = 8;
-function gt(s, e) {
+}, q = 8;
+function ct(r, e) {
   return `
     linear-gradient(45deg, ${e} 25%, transparent 25%),
     linear-gradient(-45deg, ${e} 25%, transparent 25%),
@@ -3181,84 +2828,84 @@ function gt(s, e) {
     linear-gradient(-45deg, transparent 75%, ${e} 75%)
   `;
 }
-const Xn = {
+const Ur = {
   backgroundColor: "#ffffff",
-  backgroundImage: gt("#ffffff", "#e5e5e5")
-}, Qn = {
+  backgroundImage: ct("#ffffff", "#e5e5e5")
+}, Pr = {
   backgroundColor: "#1e1e1e",
-  backgroundImage: gt("#1e1e1e", "#2d2d2d")
-}, Yn = {
+  backgroundImage: ct("#1e1e1e", "#2d2d2d")
+}, Wr = {
   display: "inline-block",
   padding: "12px",
   borderRadius: "4px",
-  backgroundSize: `${J * 2}px ${J * 2}px`,
-  backgroundPosition: `0 0, 0 ${J}px, ${J}px -${J}px, -${J}px 0`,
+  backgroundSize: `${q * 2}px ${q * 2}px`,
+  backgroundPosition: `0 0, 0 ${q}px, ${q}px -${q}px, -${q}px 0`,
   boxShadow: "0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.08)"
 };
-function es(s) {
-  const e = s === "dark" ? Qn : Xn;
+function Gr(r) {
+  const e = r === "dark" ? Pr : Ur;
   return {
-    ...Yn,
+    ...Wr,
     backgroundColor: e.backgroundColor,
     backgroundImage: e.backgroundImage
   };
 }
-function je({ src: s, alt: e, background: t }) {
-  return /* @__PURE__ */ a("div", { style: es(t), children: /* @__PURE__ */ a("img", { src: s, alt: e, style: y.image }) });
+function ze({ src: r, alt: e, background: t }) {
+  return /* @__PURE__ */ a("div", { style: Gr(t), children: /* @__PURE__ */ a("img", { src: r, alt: e, style: S.image }) });
 }
-const ts = k(
+const qr = V(
   {
     item: u.const(),
     reportModel: u.const()
   },
-  (s, e) => {
-    const { item: t, reportModel: n } = e, { entry: r } = t, i = r.background ?? "light", o = r.status === "unchanged" ? /* @__PURE__ */ a("span", { style: y.badgeMatch, children: "✓ match" }) : r.status === "changed" ? /* @__PURE__ */ a("span", { style: y.badgeChanged, children: "● changed" }) : /* @__PURE__ */ a("span", { style: y.badgeAdded, children: "+ added" }), d = r.baselineScreenshot || r.currentScreenshot;
-    return /* @__PURE__ */ f("div", { style: y.fixtureRow, children: [
-      /* @__PURE__ */ f("div", { style: y.fixtureLabel, children: [
-        /* @__PURE__ */ a("span", { style: y.fixtureName, children: t.fixtureId }),
-        o
+  (r, e) => {
+    const { item: t, reportModel: n } = e, { entry: s } = t, o = s.background ?? "light", i = s.status === "unchanged" ? /* @__PURE__ */ a("span", { style: S.badgeMatch, children: "✓ match" }) : s.status === "changed" ? /* @__PURE__ */ a("span", { style: S.badgeChanged, children: "● changed" }) : /* @__PURE__ */ a("span", { style: S.badgeAdded, children: "+ added" }), d = s.baselineScreenshot || s.currentScreenshot;
+    return /* @__PURE__ */ p("div", { style: S.fixtureRow, children: [
+      /* @__PURE__ */ p("div", { style: S.fixtureLabel, children: [
+        /* @__PURE__ */ a("span", { style: S.fixtureName, children: t.fixtureId }),
+        i
       ] }),
-      d && /* @__PURE__ */ f("div", { style: y.sideBySide, children: [
-        r.baselineScreenshot && /* @__PURE__ */ f("div", { style: y.screenshotColumn, children: [
-          /* @__PURE__ */ a("span", { style: y.columnLabel, children: "Baseline" }),
+      d && /* @__PURE__ */ p("div", { style: S.sideBySide, children: [
+        s.baselineScreenshot && /* @__PURE__ */ p("div", { style: S.screenshotColumn, children: [
+          /* @__PURE__ */ a("span", { style: S.columnLabel, children: "Baseline" }),
           /* @__PURE__ */ a(
-            je,
+            ze,
             {
-              src: n.resolveScreenshotUrl(r.baselineScreenshot),
+              src: n.resolveScreenshotUrl(s.baselineScreenshot),
               alt: `Baseline screenshot of ${t.fixtureId}`,
-              background: i
+              background: o
             }
           )
         ] }),
-        r.currentScreenshot && /* @__PURE__ */ f("div", { style: y.screenshotColumn, children: [
-          /* @__PURE__ */ a("span", { style: y.columnLabel, children: "Current" }),
+        s.currentScreenshot && /* @__PURE__ */ p("div", { style: S.screenshotColumn, children: [
+          /* @__PURE__ */ a("span", { style: S.columnLabel, children: "Current" }),
           /* @__PURE__ */ a(
-            je,
+            ze,
             {
-              src: n.resolveScreenshotUrl(r.currentScreenshot),
+              src: n.resolveScreenshotUrl(s.currentScreenshot),
               alt: `Current screenshot of ${t.fixtureId}`,
-              background: i
+              background: o
             }
           )
         ] })
       ] }),
-      !d && r.status === "unchanged" && /* @__PURE__ */ a("div", { style: y.hashRow, children: /* @__PURE__ */ f("span", { style: y.hashText, children: [
+      !d && s.status === "unchanged" && /* @__PURE__ */ a("div", { style: S.hashRow, children: /* @__PURE__ */ p("span", { style: S.hashText, children: [
         "hash: ",
-        r.targetHash
+        s.targetHash
       ] }) })
     ] });
   }
-), ns = k(
+), Kr = V(
   {
     name: u.const(),
     path: u.const(),
     items: u.const(),
     reportModel: u.const()
   },
-  (s, e) => /* @__PURE__ */ f("div", { children: [
-    /* @__PURE__ */ a("div", { style: y.groupHeader, children: /* @__PURE__ */ a("span", { style: y.groupTitle, children: e.path }) }),
-    /* @__PURE__ */ a("div", { style: y.groupContent, children: e.items.map((t) => /* @__PURE__ */ a(
-      ts,
+  (r, e) => /* @__PURE__ */ p("div", { children: [
+    /* @__PURE__ */ a("div", { style: S.groupHeader, children: /* @__PURE__ */ a("span", { style: S.groupTitle, children: e.path }) }),
+    /* @__PURE__ */ a("div", { style: S.groupContent, children: e.items.map((t) => /* @__PURE__ */ a(
+      qr,
       {
         item: t,
         reportModel: e.reportModel
@@ -3266,7 +2913,7 @@ const ts = k(
       t.fixtureId
     )) })
   ] })
-), y = {
+), S = {
   groupHeader: {
     marginBottom: 12
   },
@@ -3338,148 +2985,148 @@ const ts = k(
     color: "var(--vscode-testing-iconQueued)",
     fontWeight: 500
   }
-}, mt = "component-explorer:fixtureHeights", Pe = 500;
-let D = null;
-function vt() {
-  if (D !== null) return D;
+}, lt = "component-explorer:fixtureHeights", $e = 500;
+let M = null;
+function ht() {
+  if (M !== null) return M;
   try {
-    const s = localStorage.getItem(mt);
-    if (s)
-      return D = JSON.parse(s), D;
+    const r = localStorage.getItem(lt);
+    if (r)
+      return M = JSON.parse(r), M;
   } catch {
   }
-  return D = {}, D;
+  return M = {}, M;
 }
-function ss() {
-  if (D !== null)
+function Jr() {
+  if (M !== null)
     try {
-      const s = Object.entries(D);
-      s.length > Pe && (D = Object.fromEntries(s.slice(-Pe))), localStorage.setItem(mt, JSON.stringify(D));
+      const r = Object.entries(M);
+      r.length > $e && (M = Object.fromEntries(r.slice(-$e))), localStorage.setItem(lt, JSON.stringify(M));
     } catch {
     }
 }
-function rs(s, e) {
-  const t = vt();
-  t[s] = e, ss();
+function Zr(r, e) {
+  const t = ht();
+  t[r] = e, Jr();
 }
-function is() {
-  return new Map(Object.entries(vt()));
+function Xr() {
+  return new Map(Object.entries(ht()));
 }
-const os = 280, as = 32, ae = 32, Ge = 400, _t = "component-explorer:scrollAnchors", We = 100;
-function bt() {
+const Yr = 280, Qr = 32, ne = 32, Le = 400, ut = "component-explorer:scrollAnchors", He = 100;
+function pt() {
   try {
-    const s = localStorage.getItem(_t);
-    if (s) return JSON.parse(s);
+    const r = localStorage.getItem(ut);
+    if (r) return JSON.parse(r);
   } catch {
   }
   return {};
 }
-function ds(s, e) {
+function en(r, e) {
   try {
-    const t = bt();
-    t[s] = e;
-    const n = Object.entries(t), r = n.length > We ? Object.fromEntries(n.slice(-We)) : t;
-    localStorage.setItem(_t, JSON.stringify(r));
+    const t = pt();
+    t[r] = e;
+    const n = Object.entries(t), s = n.length > He ? Object.fromEntries(n.slice(-He)) : t;
+    localStorage.setItem(ut, JSON.stringify(s));
   } catch {
   }
 }
-function cs(s) {
-  return bt()[s];
+function tn(r) {
+  return pt()[r];
 }
-function yt(s) {
-  return s.type === "single" ? s.fixture.id : s.id;
+function ft(r) {
+  return r.type === "single" ? r.fixture.id : r.id;
 }
-function ls(s, e) {
-  const t = new Array(s.length);
-  let n = ae;
-  for (let r = 0; r < s.length; r++) {
-    const i = e.get(yt(s[r])) ?? os;
-    t[r] = { top: n, height: i }, n += i + as;
+function rn(r, e) {
+  const t = new Array(r.length);
+  let n = ne;
+  for (let s = 0; s < r.length; s++) {
+    const o = e.get(ft(r[s])) ?? Yr;
+    t[s] = { top: n, height: o }, n += o + Qr;
   }
   return t;
 }
-function hs(s) {
-  if (s.length === 0) return 0;
-  const e = s[s.length - 1];
-  return e.top + e.height + ae;
+function nn(r) {
+  if (r.length === 0) return 0;
+  const e = r[r.length - 1];
+  return e.top + e.height + ne;
 }
-function xt(s, e) {
-  let t = 0, n = s.length;
+function gt(r, e) {
+  let t = 0, n = r.length;
   for (; t < n; ) {
-    const r = t + n >> 1;
-    s[r].top + s[r].height < e ? t = r + 1 : n = r;
+    const s = t + n >> 1;
+    r[s].top + r[s].height < e ? t = s + 1 : n = s;
   }
   return t;
 }
-function us(s, e, t) {
-  if (s.length === 0) return { start: 0, end: 0 };
-  const n = xt(s, e - Ge);
-  let r = n;
-  const i = e + t + Ge;
-  for (; r < s.length && s[r].top < i; )
-    r++;
-  return { start: n, end: r };
-}
-function qe(s, e) {
-  if (s.length === 0) return;
-  const t = xt(s, e), n = Math.min(t, s.length - 1);
+function sn(r, e, t) {
+  if (r.length === 0) return { start: 0, end: 0 };
+  const n = gt(r, e - Le);
+  let s = n;
+  const o = e + t + Le;
+  for (; s < r.length && r[s].top < o; )
+    s++;
+  return { start: n, end: s };
+}
+function je(r, e) {
+  if (r.length === 0) return;
+  const t = gt(r, e), n = Math.min(t, r.length - 1);
   return {
     rowIndex: n,
-    offsetFromViewport: s[n].top - e
+    offsetFromViewport: r[n].top - e
   };
 }
-function Ke(s, e) {
-  return e.rowIndex >= s.length ? 0 : s[e.rowIndex].top - e.offsetFromViewport;
+function Ue(r, e) {
+  return e.rowIndex >= r.length ? 0 : r[e.rowIndex].top - e.offsetFromViewport;
 }
-class fs extends z({
+class on extends B({
   model: u.const()
 }) {
   constructor() {
     super(...arguments);
-    l(this, "_rowHeights", x(this, is()));
-    l(this, "_scrollTop", x(this, 0));
-    l(this, "_viewportHeight", x(this, 0));
+    l(this, "_rowHeights", w(this, Xr()));
+    l(this, "_scrollTop", w(this, 0));
+    l(this, "_viewportHeight", w(this, 0));
     l(this, "_scrollContainerRef", null);
     l(this, "_resizeObserver", null);
     l(this, "_viewportResizeObserver", null);
     l(this, "_currentNodeId");
     l(this, "_scrollSaveTimeout", null);
     l(this, "_suppressScrollHandler", !1);
-    l(this, "layout", F(this, (t) => {
-      const n = this.explorerModel.selectedFixtures.read(t), r = this._rowHeights.read(t);
-      return ls(n, r);
+    l(this, "layout", D(this, (t) => {
+      const n = this.explorerModel.selectedFixtures.read(t), s = this._rowHeights.read(t);
+      return rn(n, s);
     }));
-    l(this, "visibleRowRange", F(this, (t) => {
-      const n = this.layout.read(t), r = this._scrollTop.read(t), i = this._viewportHeight.read(t);
-      return us(n, r, i);
+    l(this, "visibleRowRange", D(this, (t) => {
+      const n = this.layout.read(t), s = this._scrollTop.read(t), o = this._viewportHeight.read(t);
+      return sn(n, s, o);
     }));
     l(this, "setScrollContainerRef", (t) => {
       var n;
-      this._scrollContainerRef && this._scrollContainerRef.removeEventListener("scroll", this._handleScroll), (n = this._viewportResizeObserver) == null || n.disconnect(), this._scrollContainerRef = t, t && (t.addEventListener("scroll", this._handleScroll, { passive: !0 }), this._viewportHeight.set(t.clientHeight, void 0), this._viewportResizeObserver = new ResizeObserver(([r]) => {
-        this._viewportHeight.set(Math.round(r.contentRect.height), void 0);
+      this._scrollContainerRef && this._scrollContainerRef.removeEventListener("scroll", this._handleScroll), (n = this._viewportResizeObserver) == null || n.disconnect(), this._scrollContainerRef = t, t && (t.addEventListener("scroll", this._handleScroll, { passive: !0 }), this._viewportHeight.set(t.clientHeight, void 0), this._viewportResizeObserver = new ResizeObserver(([s]) => {
+        this._viewportHeight.set(Math.round(s.contentRect.height), void 0);
       }), this._viewportResizeObserver.observe(t), this._restoreScrollPosition());
     });
     l(this, "_handleScroll", () => {
       this._scrollContainerRef && (this._scrollTop.set(this._scrollContainerRef.scrollTop, void 0), !(this._suppressScrollHandler || !this._currentNodeId) && (this._scrollSaveTimeout && clearTimeout(this._scrollSaveTimeout), this._scrollSaveTimeout = setTimeout(() => {
         if (!this._currentNodeId) return;
-        const t = this.layout.get(), n = qe(t, this._scrollTop.get());
-        n && ds(this._currentNodeId, n);
+        const t = this.layout.get(), n = je(t, this._scrollTop.get());
+        n && en(this._currentNodeId, n);
       }, 150)));
     });
     l(this, "observeRowElement", (t, n) => {
-      t && (this._resizeObserver || (this._resizeObserver = new ResizeObserver((r) => {
-        const i = this._rowHeights.get();
-        let o;
-        for (const d of r) {
+      t && (this._resizeObserver || (this._resizeObserver = new ResizeObserver((s) => {
+        const o = this._rowHeights.get();
+        let i;
+        for (const d of s) {
           const c = d.target.getAttribute("data-row-id");
           if (!c) continue;
           const h = Math.round(d.contentRect.height);
-          h > 0 && i.get(c) !== h && (o || (o = new Map(i)), o.set(c, h), rs(c, h));
+          h > 0 && o.get(c) !== h && (i || (i = new Map(o)), i.set(c, h), Zr(c, h));
         }
-        if (o) {
-          const d = this.layout.get(), c = qe(d, this._scrollTop.get());
-          if (this._rowHeights.set(o, void 0), c && this._scrollContainerRef) {
-            const h = this.layout.get(), m = Ke(h, c);
+        if (i) {
+          const d = this.layout.get(), c = je(d, this._scrollTop.get());
+          if (this._rowHeights.set(i, void 0), c && this._scrollContainerRef) {
+            const h = this.layout.get(), m = Ue(h, c);
             this._suppressScrollHandler = !0, this._scrollContainerRef.scrollTop = m, this._scrollTop.set(m, void 0), requestAnimationFrame(() => {
               this._suppressScrollHandler = !1;
             });
@@ -3496,10 +3143,10 @@ class fs extends z({
   }
   _restoreScrollPosition() {
     if (!this._scrollContainerRef || !this._currentNodeId) return;
-    const t = cs(this._currentNodeId);
+    const t = tn(this._currentNodeId);
     if (!t) return;
-    const n = this.layout.get(), r = Ke(n, t);
-    this._suppressScrollHandler = !0, this._scrollContainerRef.scrollTop = r, this._scrollTop.set(r, void 0), requestAnimationFrame(() => {
+    const n = this.layout.get(), s = Ue(n, t);
+    this._suppressScrollHandler = !0, this._scrollContainerRef.scrollTop = s, this._scrollTop.set(s, void 0), requestAnimationFrame(() => {
       this._suppressScrollHandler = !1;
     });
   }
@@ -3508,35 +3155,35 @@ class fs extends z({
     (t = this._resizeObserver) == null || t.disconnect(), (n = this._viewportResizeObserver) == null || n.disconnect(), this._scrollContainerRef && this._scrollContainerRef.removeEventListener("scroll", this._handleScroll), this._scrollSaveTimeout && clearTimeout(this._scrollSaveTimeout);
   }
 }
-const ps = $(
-  fs,
+const an = A(
+  on,
   {},
-  (s, e) => {
-    const t = e.explorerModel.selectedFixtures.read(s), n = e.explorerModel.selectedNodeId.read(s), r = e.layout.read(s), { start: i, end: o } = e.visibleRowRange.read(s);
+  (r, e) => {
+    const t = e.explorerModel.selectedFixtures.read(r), n = e.explorerModel.selectedNodeId.read(r), s = e.layout.read(r), { start: o, end: i } = e.visibleRowRange.read(r);
     if (e.updateForSelection(n), t.length === 0) {
       const c = e.explorerModel.reportModel;
       if (c) {
-        const h = c.state.read(s);
+        const h = c.state.read(r);
         if (h.status === "loading")
           return /* @__PURE__ */ a("div", { style: N.emptyState, children: /* @__PURE__ */ a("span", { style: N.emptyText, children: "Loading report..." }) });
         if (h.status === "error")
-          return /* @__PURE__ */ a("div", { style: N.emptyState, children: /* @__PURE__ */ f("span", { style: { ...N.emptyText, color: "var(--vscode-errorForeground)" }, children: [
+          return /* @__PURE__ */ a("div", { style: N.emptyState, children: /* @__PURE__ */ p("span", { style: { ...N.emptyText, color: "var(--vscode-errorForeground)" }, children: [
             "Failed to load report: ",
             h.message
           ] }) });
       }
       return /* @__PURE__ */ a("div", { style: N.emptyState, children: /* @__PURE__ */ a("span", { style: N.emptyText, children: "Select a component or folder to preview" }) });
     }
-    const d = hs(r);
-    return /* @__PURE__ */ a("div", { ref: e.setScrollContainerRef, style: N.scrollContainer, children: /* @__PURE__ */ a("div", { style: { position: "relative", height: d }, children: t.slice(i, o).map((c, h) => {
-      const m = i + h, { top: _ } = r[m], g = yt(c);
+    const d = nn(s);
+    return /* @__PURE__ */ a("div", { ref: e.setScrollContainerRef, style: N.scrollContainer, children: /* @__PURE__ */ a("div", { style: { position: "relative", height: d }, children: t.slice(o, i).map((c, h) => {
+      const m = o + h, { top: v } = s[m], R = ft(c);
       return /* @__PURE__ */ a(
         "div",
         {
-          ref: (v) => e.observeRowElement(v, g),
-          style: { position: "absolute", top: _, left: ae, right: ae },
-          children: c.type === "single" ? /* @__PURE__ */ a(ft, { fixture: c.fixture, compact: !1 }) : c.type === "variants" ? /* @__PURE__ */ a(gs, { row: c }) : c.type === "screenshot-comparison" && e.explorerModel.daemon ? /* @__PURE__ */ a(
-            Zn,
+          ref: (g) => e.observeRowElement(g, R),
+          style: { position: "absolute", top: v, left: ne, right: ne },
+          children: c.type === "single" ? /* @__PURE__ */ a(at, { fixture: c.fixture, compact: !1 }) : c.type === "variants" ? /* @__PURE__ */ a(dn, { row: c }) : c.type === "screenshot-comparison" && e.explorerModel.daemon ? /* @__PURE__ */ a(
+            jr,
             {
               name: c.name,
               path: c.path,
@@ -3546,7 +3193,7 @@ const ps = $(
               currentSession: "current"
             }
           ) : c.type === "report-comparison" && e.explorerModel.reportModel ? /* @__PURE__ */ a(
-            ns,
+            Kr,
             {
               name: c.name,
               path: c.path,
@@ -3555,17 +3202,17 @@ const ps = $(
             }
           ) : null
         },
-        g
+        R
       );
     }) }) });
   }
-), gs = k(
+), dn = V(
   { row: u.const() },
-  (s, e) => {
+  (r, e) => {
     const t = e.row;
-    return /* @__PURE__ */ f("div", { children: [
+    return /* @__PURE__ */ p("div", { children: [
       /* @__PURE__ */ a("div", { style: N.variantsHeader, children: /* @__PURE__ */ a("span", { style: N.variantsTitle, children: t.path }) }),
-      /* @__PURE__ */ a("div", { style: N.variantsContent, children: t.fixtures.map((n) => /* @__PURE__ */ a(ft, { fixture: n, compact: !0 }, n.id)) })
+      /* @__PURE__ */ a("div", { style: N.variantsContent, children: t.fixtures.map((n) => /* @__PURE__ */ a(at, { fixture: n, compact: !0 }, n.id)) })
     ] });
   }
 ), N = {
@@ -3599,55 +3246,58 @@ const ps = $(
     flexWrap: "wrap",
     gap: "16px"
   }
-}, ms = $(
-  Sn,
+}, cn = A(
+  gr,
   { daemonModel: u.const(), reportModel: u.const() },
-  (s, e) => {
-    const t = e.leftSidebarVisible.read(s), n = e.rightSidebarVisible.read(s), r = e.isDarkTheme.read(s), i = e.selectedNode.read(s);
-    return /* @__PURE__ */ f("div", { className: r ? "vscode-theme default-dark-plus" : "vscode-theme default-light-plus", style: p.container, children: [
-      t && /* @__PURE__ */ a(Bn, { model: e }),
-      /* @__PURE__ */ f("div", { style: p.centerArea, children: [
-        /* @__PURE__ */ a(Fn, { model: e }),
-        /* @__PURE__ */ a(ps, { model: e })
+  (r, e) => {
+    const t = e.leftSidebarVisible.read(r), n = e.rightSidebarVisible.read(r), s = e.isDarkTheme.read(r), o = e.selectedNode.read(r);
+    return /* @__PURE__ */ p("div", { className: s ? "vscode-theme default-dark-plus" : "vscode-theme default-light-plus", style: f.container, children: [
+      t && /* @__PURE__ */ a(kr, { model: e }),
+      /* @__PURE__ */ p("div", { style: f.centerArea, children: [
+        /* @__PURE__ */ a(Tr, { model: e }),
+        /* @__PURE__ */ a(an, { model: e })
       ] }),
-      n && /* @__PURE__ */ a(Ln, { selectedNode: i })
+      n && /* @__PURE__ */ a(Dr, { selectedNode: o })
     ] });
   }
 );
-var vs = class be {
+var ln = class fe {
   constructor(e) {
     this.iterator = e;
   }
   static fromIterable(e) {
-    return new be(e[Symbol.asyncIterator]());
+    return new fe(e[Symbol.asyncIterator]());
   }
   static fromFn(e) {
-    return new be(e());
+    return new fe(e());
   }
   [Symbol.asyncIterator]() {
     return this.iterator;
   }
-}, _s = class extends Error {
-  constructor(s, e, t) {
-    super(t), this.statusCode = s, this.method = e, this.name = "ApiError";
+}, hn = class extends Error {
+  constructor(r, e, t) {
+    super(t), this.statusCode = r, this.method = e, this.name = "ApiError";
   }
-}, bs = class {
-  constructor(s) {
+}, un = class {
+  constructor(r) {
     l(this, "methods", this._createProxy(""));
-    this._request = s;
+    this._request = r;
   }
-  _createProxy(s) {
+  _createProxy(r) {
     return new Proxy(() => {
     }, {
-      apply: async (e, t, n) => await this._request(s, n[0]),
-      get: (e, t) => this._createProxy(`${s}${s ? "/" : ""}${t}`)
+      apply: async (e, t, n) => await this._request(r, n[0]),
+      get: (e, t) => {
+        if (typeof t != "symbol" && !(t === "then" || t === "catch" || t === "finally" || t === "toString" || t === "valueOf" || t === "toJSON" || t === "name" || t === "length" || t === "prototype" || t === "constructor" || t === "caller" || t === "arguments"))
+          return this._createProxy(`${r}${r ? "/" : ""}${t}`);
+      }
     });
   }
 };
-function ys(s, e) {
-  return new bs(async (t, n) => {
+function pn(r, e) {
+  return new un(async (t, n) => {
     var d;
-    const r = await fetch(`${s}/${t}`, {
+    const s = await fetch(`${r}/${t}`, {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
@@ -3655,40 +3305,40 @@ function ys(s, e) {
       },
       body: JSON.stringify(n)
     });
-    if (r.status !== 200) {
-      const c = await r.json().catch(() => null);
+    if (s.status !== 200) {
+      const c = await s.json().catch(() => null);
       let h;
-      throw c && typeof c == "object" && "errorMessage" in c ? h = `${c.errorMessage}` : h = `Error calling API method ${t}: ${JSON.stringify(c)} (Status: ${r.status}, Status Text: ${r.statusText})`, new _s(r.status, t, h);
+      throw c && typeof c == "object" && "errorMessage" in c ? h = `${c.errorMessage}` : h = `Error calling API method ${t}: ${JSON.stringify(c)} (Status: ${s.status}, Status Text: ${s.statusText})`, new hn(s.status, t, h);
     }
-    const i = r.headers.get("Content-Type");
-    return i != null && i.startsWith("application/jsonl") ? vs.fromFn(async function* () {
-      var g;
-      const c = (g = r.body) == null ? void 0 : g.getReader();
+    const o = s.headers.get("Content-Type");
+    return o != null && o.startsWith("application/jsonl") ? ln.fromFn(async function* () {
+      var R;
+      const c = (R = s.body) == null ? void 0 : R.getReader();
       if (!c)
         return;
       let h = "";
       const m = new TextDecoder("utf-8");
       for (; ; ) {
-        const { done: v, value: E } = await c.read();
-        if (v)
+        const { done: g, value: _ } = await c.read();
+        if (g)
           break;
-        h += m.decode(E, { stream: !0 });
-        let V;
-        for (; (V = h.indexOf(`
+        h += m.decode(_, { stream: !0 });
+        let b;
+        for (; (b = h.indexOf(`
 `)) >= 0; ) {
-          const S = h.slice(0, V).trim();
-          h = h.slice(V + 1), S.length > 0 && (yield JSON.parse(S));
+          const y = h.slice(0, b).trim();
+          h = h.slice(b + 1), y.length > 0 && (yield JSON.parse(y));
         }
       }
-      const _ = h.trim();
-      _.length > 0 && (yield JSON.parse(_));
-    }) : await r.json();
+      const v = h.trim();
+      v.length > 0 && (yield JSON.parse(v));
+    }) : await s.json();
   });
 }
-class xs {
+class fn {
   constructor(e) {
-    l(this, "_sourceTreeIds", x(this, /* @__PURE__ */ new Map()));
-    l(this, "_sessions", x(this, []));
+    l(this, "_sourceTreeIds", w(this, /* @__PURE__ */ new Map()));
+    l(this, "_sessions", w(this, []));
     l(this, "_screenshotCache", /* @__PURE__ */ new Map());
     l(this, "_client");
     l(this, "_eventStreamAbort", null);
@@ -3697,7 +3347,7 @@ class xs {
     l(this, "sourceTreeIds", this._sourceTreeIds);
     /** Observable list of sessions from the daemon */
     l(this, "sessions", this._sessions);
-    this.config = e, this.sessionName = e.sessionName, this._client = ys("/__explorer/daemon-api");
+    this.config = e, this.sessionName = e.sessionName, this._client = pn("/__explorer/daemon-api");
   }
   /**
    * Initializes the model: fetches initial session info and starts listening to events.
@@ -3714,30 +3364,30 @@ class xs {
     const n = this._sourceTreeIds.get().get(e);
     if (!n)
       throw new Error(`No sourceTreeId known for session '${e}'`);
-    const r = `${e}:${t}`, i = this._screenshotCache.get(r);
-    if (i && i.sourceTreeId === n)
-      return i.data;
-    const o = await this._client.methods.screenshots.take({
+    const s = `${e}:${t}`, o = this._screenshotCache.get(s);
+    if (o && o.sourceTreeId === n)
+      return o.data;
+    const i = await this._client.methods.screenshots.take({
       fixtureId: t,
       sessionName: e,
       sourceTreeId: n,
       includeImage: !0
     });
-    return this._screenshotCache.set(r, { sourceTreeId: n, data: o }), o;
+    return this._screenshotCache.set(s, { sourceTreeId: n, data: i }), i;
   }
   /**
    * Compare a fixture across two sessions. Returns match status and hashes (no images).
    */
   async compare(e, t, n) {
-    const r = this._sourceTreeIds.get().get(t), i = this._sourceTreeIds.get().get(n);
-    if (!r || !i)
+    const s = this._sourceTreeIds.get().get(t), o = this._sourceTreeIds.get().get(n);
+    if (!s || !o)
       throw new Error("Missing sourceTreeId for sessions");
     return this._client.methods.screenshots.compare({
       fixtureId: e,
       baselineSessionName: t,
-      baselineSourceTreeId: r,
+      baselineSourceTreeId: s,
       currentSessionName: n,
-      currentSourceTreeId: i,
+      currentSourceTreeId: o,
       includeImages: !1
     });
   }
@@ -3767,8 +3417,8 @@ class xs {
   // ---------------------------------------------------------------------------
   async _fetchSessionInfos() {
     const e = await this._client.methods.sessions(), t = /* @__PURE__ */ new Map(), n = [];
-    for (const r of e)
-      t.set(r.name, r.sourceTreeId), n.push({ name: r.name, serverUrl: r.serverUrl });
+    for (const s of e)
+      t.set(s.name, s.sourceTreeId), n.push({ name: s.name, serverUrl: s.serverUrl });
     this._sourceTreeIds.set(t, void 0), this._sessions.set(n, void 0);
   }
   async _startEventStream() {
@@ -3795,12 +3445,12 @@ class xs {
     }
   }
 }
-function Cs() {
+function gn() {
   return window.__EXPLORER_DAEMON__;
 }
-class Ss {
+class mn {
   constructor(e) {
-    l(this, "state", x(this, { status: "loading" }));
+    l(this, "state", w(this, { status: "loading" }));
     l(this, "_baseUrl");
     this.reportUrl = e;
     const t = e.lastIndexOf("/");
@@ -3811,7 +3461,7 @@ class Ss {
   }
   buildTree(e) {
     const t = this.state.read(e);
-    return t.status !== "ready" ? { id: "", name: "Report", type: "folder", children: [] } : ws(t.report.fixtures);
+    return t.status !== "ready" ? { id: "", name: "Report", type: "folder", children: [] } : vn(t.report.fixtures);
   }
   async _fetch() {
     this.state.set({ status: "loading" }, void 0);
@@ -3826,35 +3476,35 @@ class Ss {
     }
   }
 }
-function ws(s) {
+function vn(r) {
   const e = { id: "", name: "Components", type: "folder", children: [] };
-  for (const [t, n] of Object.entries(s)) {
-    const r = t.split("/");
-    let i = e;
-    for (let o = 0; o < r.length; o++) {
-      const d = r[o], c = o === r.length - 1, h = r.slice(0, o + 1).join("/");
+  for (const [t, n] of Object.entries(r)) {
+    const s = t.split("/");
+    let o = e;
+    for (let i = 0; i < s.length; i++) {
+      const d = s[i], c = i === s.length - 1, h = s.slice(0, i + 1).join("/");
       if (c)
-        i.children.push({
+        o.children.push({
           id: h,
           name: d,
           type: "component",
           reportEntry: n
         });
       else {
-        let m = i.children.find((_) => _.type === "folder" && _.name === d);
-        m || (m = { id: h, name: d, type: "folder", children: [] }, i.children.push(m)), i = m;
+        let m = o.children.find((v) => v.type === "folder" && v.name === d);
+        m || (m = { id: h, name: d, type: "folder", children: [] }, o.children.push(m)), o = m;
       }
     }
   }
   return e;
 }
-class Bs {
+class Vn {
   constructor(e, t) {
     l(this, "_root");
-    l(this, "_registry", new un());
+    l(this, "_registry", new sr());
     l(this, "_daemonModel");
     l(this, "_reportModel");
-    this._populateRegistry(t), this._reportModel = this._initializeReportModel(), this._daemonModel = this._reportModel ? void 0 : this._initializeDaemonModel(), this._root = It(e), this._root.render(kt(ms, {
+    this._populateRegistry(t), this._reportModel = this._initializeReportModel(), this._daemonModel = this._reportModel ? void 0 : this._initializeDaemonModel(), this._root = _t(e), this._root.render(Ct(cn, {
       registry: this._registry,
       daemonModel: this._daemonModel,
       reportModel: this._reportModel
@@ -3863,13 +3513,13 @@ class Bs {
   _initializeReportModel() {
     const t = new URLSearchParams(location.search).get("report");
     if (t)
-      return new Ss(t);
+      return new mn(t);
   }
   _initializeDaemonModel() {
-    const e = Cs();
+    const e = gn();
     if (!e)
       return;
-    const t = new xs(e);
+    const t = new fn(e);
     return t.initialize().catch((n) => {
       console.error("[ExplorerApp] Failed to initialize DaemonModel:", n);
     }), t;
@@ -3877,8 +3527,8 @@ class Bs {
   _populateRegistry(e) {
     this._registry.clear();
     for (const [t, n] of Object.entries(e)) {
-      const r = n.default;
-      r && typeof r == "object" && this._registry.register(t, r);
+      const s = n.default;
+      s && typeof s == "object" && this._registry.register(t, s);
     }
   }
   /**
@@ -3902,50 +3552,52 @@ class Bs {
   }
 }
 export {
-  On as ChevronDownIcon,
-  In as ChevronRightIcon,
-  As as CliRuntime,
-  Rn as ComponentIcon,
-  xs as DaemonModel,
-  ms as Explorer,
-  Bs as ExplorerApp,
-  Sn as ExplorerModel,
-  un as FixtureRegistry,
-  Tn as FolderIcon,
-  Bn as LeftSidebar,
-  Dn as MoonIcon,
-  kn as PanelLeftIcon,
-  Vn as PanelRightIcon,
-  Ss as ReportModel,
-  Ln as RightSidebar,
-  Nn as SunIcon,
-  Fn as TitleBar,
-  ce as TitleBarButton,
-  An as TreeItem,
-  ut as TreeView,
-  Vt as VIEWPORT_SIZES,
-  Ft as collectComponents,
-  Me as createComponentDefinition,
-  le as createFixtureTree,
-  Hs as defineFixture,
-  Ls as defineFixtureGroup,
-  Us as defineFixtureVariants,
-  Fe as findNodeByPath,
-  ke as fixtureGroupBrand,
-  Ve as fixtureVariantsBrand,
-  Dt as getDefaultPropertyValues,
-  Es as isComponentDefinition,
-  Ce as isFixtureGroup,
-  Se as isFixtureVariants,
-  xe as isSingleFixture,
-  Te as mergeStyles,
-  Ns as parseFixtureExport,
-  Ms as parseFixtureGroup,
-  Fs as parseFixtureVariants,
-  Ds as parseSingleFixture,
-  Nt as resolveViewport,
-  Ne as singleFixtureBrand,
-  p as styles,
-  ht as toExplorerTree
+  _r as ChevronDownIcon,
+  vr as ChevronRightIcon,
+  kn as CliRuntime,
+  br as ComponentIcon,
+  fn as DaemonModel,
+  cn as Explorer,
+  Vn as ExplorerApp,
+  gr as ExplorerModel,
+  sr as FixtureRegistry,
+  yr as FolderIcon,
+  kr as LeftSidebar,
+  wr as MoonIcon,
+  xr as PanelLeftIcon,
+  Cr as PanelRightIcon,
+  mn as ReportModel,
+  Dr as RightSidebar,
+  Sr as SunIcon,
+  Tr as TitleBar,
+  oe as TitleBarButton,
+  Or as TreeItem,
+  it as TreeView,
+  St as VIEWPORT_SIZES,
+  Dn as asyncRender,
+  It as collectComponents,
+  Oe as createComponentDefinition,
+  ie as createFixtureTree,
+  Fn as defineFixture,
+  En as defineFixtureGroup,
+  Bn as defineFixtureVariants,
+  ke as findNodeByPath,
+  we as fixtureGroupBrand,
+  Re as fixtureVariantsBrand,
+  Rt as getDefaultPropertyValues,
+  On as isComponentDefinition,
+  ve as isFixtureGroup,
+  _e as isFixtureVariants,
+  me as isSingleFixture,
+  Se as mergeStyles,
+  wn as parseFixtureExport,
+  Tn as parseFixtureGroup,
+  In as parseFixtureVariants,
+  Rn as parseSingleFixture,
+  wt as resolveViewport,
+  Te as singleFixtureBrand,
+  f as styles,
+  An as syncRender,
+  ot as toExplorerTree
 };
 //# sourceMappingURL=viewer.js.map