@yoltra/devtools-ui 0.3.0 → 0.5.0

package/dist/devtools-ui.mjs

@@ -0,0 +1,885 @@
+import Re, { createContext as ve, useState as k, useRef as A, useCallback as O, useEffect as M, useContext as be, useMemo as Oe } from "react";
+import { DevtoolsRole as b, PROTOCOL_VERSION as K } from "@yoltra/devtools-protocol";
+const H = () => {
+}, de = ve({
+  status: "disconnected",
+  extensionId: "",
+  send: H,
+  subscribe: () => H,
+  disconnect: H,
+  reconnect: H
+});
+var X = { exports: {} }, L = {};
+/**
+ * @license React
+ * react-jsx-runtime.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var ie;
+function ye() {
+  if (ie) return L;
+  ie = 1;
+  var e = Symbol.for("react.transitional.element"), s = Symbol.for("react.fragment");
+  function r(o, t, c) {
+    var i = null;
+    if (c !== void 0 && (i = "" + c), t.key !== void 0 && (i = "" + t.key), "key" in t) {
+      c = {};
+      for (var a in t)
+        a !== "key" && (c[a] = t[a]);
+    } else c = t;
+    return t = c.ref, {
+      $$typeof: e,
+      type: o,
+      key: i,
+      ref: t !== void 0 ? t : null,
+      props: c
+    };
+  }
+  return L.Fragment = s, L.jsx = r, L.jsxs = r, L;
+}
+var U = {};
+/**
+ * @license React
+ * react-jsx-runtime.development.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var ae;
+function _e() {
+  return ae || (ae = 1, process.env.NODE_ENV !== "production" && (function() {
+    function e(n) {
+      if (n == null) return null;
+      if (typeof n == "function")
+        return n.$$typeof === he ? null : n.displayName || n.name || null;
+      if (typeof n == "string") return n;
+      switch (n) {
+        case N:
+          return "Fragment";
+        case R:
+          return "Profiler";
+        case E:
+          return "StrictMode";
+        case d:
+          return "Suspense";
+        case w:
+          return "SuspenseList";
+        case Se:
+          return "Activity";
+      }
+      if (typeof n == "object")
+        switch (typeof n.tag == "number" && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), n.$$typeof) {
+          case T:
+            return "Portal";
+          case g:
+            return (n.displayName || "Context") + ".Provider";
+          case x:
+            return (n._context.displayName || "Context") + ".Consumer";
+          case I:
+            var f = n.render;
+            return n = n.displayName, n || (n = f.displayName || f.name || "", n = n !== "" ? "ForwardRef(" + n + ")" : "ForwardRef"), n;
+          case C:
+            return f = n.displayName || null, f !== null ? f : e(n.type) || "Memo";
+          case V:
+            f = n._payload, n = n._init;
+            try {
+              return e(n(f));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function s(n) {
+      return "" + n;
+    }
+    function r(n) {
+      try {
+        s(n);
+        var f = !1;
+      } catch {
+        f = !0;
+      }
+      if (f) {
+        f = console;
+        var p = f.error, y = typeof Symbol == "function" && Symbol.toStringTag && n[Symbol.toStringTag] || n.constructor.name || "Object";
+        return p.call(
+          f,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          y
+        ), s(n);
+      }
+    }
+    function o(n) {
+      if (n === N) return "<>";
+      if (typeof n == "object" && n !== null && n.$$typeof === V)
+        return "<...>";
+      try {
+        var f = e(n);
+        return f ? "<" + f + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function t() {
+      var n = J.A;
+      return n === null ? null : n.getOwner();
+    }
+    function c() {
+      return Error("react-stack-top-frame");
+    }
+    function i(n) {
+      if (te.call(n, "key")) {
+        var f = Object.getOwnPropertyDescriptor(n, "key").get;
+        if (f && f.isReactWarning) return !1;
+      }
+      return n.key !== void 0;
+    }
+    function a(n, f) {
+      function p() {
+        re || (re = !0, console.error(
+          "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
+          f
+        ));
+      }
+      p.isReactWarning = !0, Object.defineProperty(n, "key", {
+        get: p,
+        configurable: !0
+      });
+    }
+    function u() {
+      var n = e(this.type);
+      return ne[n] || (ne[n] = !0, console.error(
+        "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
+      )), n = this.props.ref, n !== void 0 ? n : null;
+    }
+    function S(n, f, p, y, D, P, W, G) {
+      return p = P.ref, n = {
+        $$typeof: v,
+        type: n,
+        key: f,
+        props: P,
+        _owner: D
+      }, (p !== void 0 ? p : null) !== null ? Object.defineProperty(n, "ref", {
+        enumerable: !1,
+        get: u
+      }) : Object.defineProperty(n, "ref", { enumerable: !1, value: null }), n._store = {}, Object.defineProperty(n._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: 0
+      }), Object.defineProperty(n, "_debugInfo", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: null
+      }), Object.defineProperty(n, "_debugStack", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: W
+      }), Object.defineProperty(n, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: G
+      }), Object.freeze && (Object.freeze(n.props), Object.freeze(n)), n;
+    }
+    function l(n, f, p, y, D, P, W, G) {
+      var _ = f.children;
+      if (_ !== void 0)
+        if (y)
+          if (Te(_)) {
+            for (y = 0; y < _.length; y++)
+              h(_[y]);
+            Object.freeze && Object.freeze(_);
+          } else
+            console.error(
+              "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
+            );
+        else h(_);
+      if (te.call(f, "key")) {
+        _ = e(n);
+        var Y = Object.keys(f).filter(function(me) {
+          return me !== "key";
+        });
+        y = 0 < Y.length ? "{key: someKey, " + Y.join(": ..., ") + ": ...}" : "{key: someKey}", ce[_ + y] || (Y = 0 < Y.length ? "{" + Y.join(": ..., ") + ": ...}" : "{}", console.error(
+          `A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,
+          y,
+          _,
+          Y,
+          _
+        ), ce[_ + y] = !0);
+      }
+      if (_ = null, p !== void 0 && (r(p), _ = "" + p), i(f) && (r(f.key), _ = "" + f.key), "key" in f) {
+        p = {};
+        for (var B in f)
+          B !== "key" && (p[B] = f[B]);
+      } else p = f;
+      return _ && a(
+        p,
+        typeof n == "function" ? n.displayName || n.name || "Unknown" : n
+      ), S(
+        n,
+        _,
+        P,
+        D,
+        t(),
+        p,
+        W,
+        G
+      );
+    }
+    function h(n) {
+      typeof n == "object" && n !== null && n.$$typeof === v && n._store && (n._store.validated = 1);
+    }
+    var m = Re, v = Symbol.for("react.transitional.element"), T = Symbol.for("react.portal"), N = Symbol.for("react.fragment"), E = Symbol.for("react.strict_mode"), R = Symbol.for("react.profiler"), x = Symbol.for("react.consumer"), g = Symbol.for("react.context"), I = Symbol.for("react.forward_ref"), d = Symbol.for("react.suspense"), w = Symbol.for("react.suspense_list"), C = Symbol.for("react.memo"), V = Symbol.for("react.lazy"), Se = Symbol.for("react.activity"), he = Symbol.for("react.client.reference"), J = m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, te = Object.prototype.hasOwnProperty, Te = Array.isArray, q = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    m = {
+      react_stack_bottom_frame: function(n) {
+        return n();
+      }
+    };
+    var re, ne = {}, se = m.react_stack_bottom_frame.bind(
+      m,
+      c
+    )(), oe = q(o(c)), ce = {};
+    U.Fragment = N, U.jsx = function(n, f, p, y, D) {
+      var P = 1e4 > J.recentlyCreatedOwnerStacks++;
+      return l(
+        n,
+        f,
+        p,
+        !1,
+        y,
+        D,
+        P ? Error("react-stack-top-frame") : se,
+        P ? q(o(n)) : oe
+      );
+    }, U.jsxs = function(n, f, p, y, D) {
+      var P = 1e4 > J.recentlyCreatedOwnerStacks++;
+      return l(
+        n,
+        f,
+        p,
+        !0,
+        y,
+        D,
+        P ? Error("react-stack-top-frame") : se,
+        P ? q(o(n)) : oe
+      );
+    };
+  })()), U;
+}
+var ue;
+function Ne() {
+  return ue || (ue = 1, process.env.NODE_ENV === "production" ? X.exports = ye() : X.exports = _e()), X.exports;
+}
+var Ie = Ne();
+const Ae = {
+  timeTravel: !0,
+  eventReplay: !0,
+  stateExplorer: !0,
+  eventEmit: !0,
+  performanceMetrics: !0
+}, ke = 750, xe = 3e4;
+function Le({
+  config: e,
+  children: s
+}) {
+  const [r, o] = k("disconnected"), t = A(null), c = A(/* @__PURE__ */ new Set()), i = A(0), a = A(null), u = A(crypto.randomUUID()), S = A(e);
+  S.current = e;
+  const l = O(() => {
+    const E = S.current, x = `ws://${E.host ?? "localhost"}:${E.port}`, g = E.WebSocket ?? (typeof globalThis.WebSocket < "u" ? globalThis.WebSocket : void 0);
+    if (!g) {
+      console.error(
+        "[Yoltra DevTools] No WebSocket implementation available. In Node.js, pass { WebSocket } from 'ws' via config.WebSocket."
+      );
+      return;
+    }
+    o("connecting");
+    try {
+      const I = new g(x);
+      t.current = I, I.onopen = () => {
+        i.current = 0;
+        const d = JSON.stringify({
+          type: "HANDSHAKE_REQUEST",
+          protocolVersion: K,
+          role: b.EXTENSION,
+          extension: {
+            id: u.current,
+            name: E.extensionName ?? "DevTools UI",
+            capabilities: Ae
+          }
+        });
+        I.send(d);
+      }, I.onmessage = (d) => {
+        try {
+          const w = typeof d.data == "string" ? d.data : String(d.data), C = JSON.parse(w);
+          if (C.type === "HANDSHAKE_RESPONSE") {
+            C.success ? o("connected") : I.close();
+            return;
+          }
+          c.current.forEach((V) => V(C));
+        } catch {
+        }
+      }, I.onclose = () => {
+        t.current = null, o("disconnected");
+        const d = E.autoReconnect ?? !0, w = E.maxReconnectAttempts ?? 1 / 0;
+        if (d && i.current < w) {
+          const C = i.current++, V = Math.min(
+            ke * Math.pow(2, C) + Math.random() * 500,
+            xe
+          );
+          a.current = setTimeout(l, V);
+        }
+      }, I.onerror = () => {
+      };
+    } catch {
+      o("disconnected");
+    }
+  }, []), h = O(() => {
+    a.current && (clearTimeout(a.current), a.current = null), i.current = 1 / 0, t.current?.close(), t.current = null, o("disconnected");
+  }, []), m = O(() => {
+    i.current = 0, t.current?.close(), t.current = null, l();
+  }, [l]), v = O((E) => {
+    const R = t.current;
+    R && R.readyState === 1 && R.send(JSON.stringify(E));
+  }, []), T = O((E) => (c.current.add(E), () => {
+    c.current.delete(E);
+  }), []);
+  M(() => (l(), () => {
+    a.current && clearTimeout(a.current), i.current = 1 / 0, t.current?.close();
+  }), [l]);
+  const N = {
+    status: r,
+    extensionId: u.current,
+    send: v,
+    subscribe: T,
+    disconnect: h,
+    reconnect: m
+  };
+  return /* @__PURE__ */ Ie.jsx(de.Provider, { value: N, children: s });
+}
+function j() {
+  return be(de);
+}
+function Ue(e) {
+  const { send: s, extensionId: r } = j();
+  return { emit: O(
+    (t, c, i) => {
+      e && s({
+        type: "EMIT_TO_STORE",
+        storeId: e,
+        event: { channel: t, type: c, payload: i },
+        timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+        sourceId: r,
+        sourceRole: b.EXTENSION
+      });
+    },
+    [e, s, r]
+  ) };
+}
+const we = 2e3;
+function Fe(e, s) {
+  const { subscribe: r } = j(), o = s?.maxEntries ?? we, t = A(/* @__PURE__ */ new Map()), c = A(o);
+  c.current = o;
+  const [, i] = k(0);
+  M(() => r((l) => {
+    if (l.type !== "STORE_EVENT") return;
+    const h = l.storeId, m = {
+      event: l.event,
+      storeId: h,
+      patches: l.patches,
+      snapshotVersion: l.snapshotVersion,
+      committed: l.committed,
+      timestamp: l.timestamp
+    }, T = [...t.current.get(h) ?? [], m];
+    t.current.set(
+      h,
+      T.length > c.current ? T.slice(T.length - c.current) : T
+    ), i((N) => N + 1);
+  }), [r]);
+  const a = O(() => {
+    e && (t.current.delete(e), i((S) => S + 1));
+  }, [e]);
+  return { entries: e ? t.current.get(e) ?? [] : [], clear: a };
+}
+function He(e) {
+  const { send: s, extensionId: r } = j();
+  return { replay: O(
+    (t, c) => {
+      e && s({
+        type: "EVENT_REPLAY",
+        storeId: e,
+        snapshot: t,
+        events: c.map((i) => ({
+          id: i.event.id,
+          channel: i.event.channel,
+          type: i.event.type,
+          payload: i.event.payload
+        })),
+        timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+        sourceId: r,
+        sourceRole: b.EXTENSION
+      });
+    },
+    [e, s, r]
+  ) };
+}
+function Xe(e, s) {
+  const { send: r, subscribe: o, extensionId: t } = j(), [c, i] = k(null), [a, u] = k(!1), S = s?.refreshIntervalMs ?? 2e3, l = A(null), h = O(() => {
+    e && (u(!0), r({
+      type: "REQUEST_METRICS",
+      storeId: e,
+      timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+      sourceId: t,
+      sourceRole: b.EXTENSION
+    }));
+  }, [e, r, t]);
+  return M(() => {
+    if (!e) {
+      i(null);
+      return;
+    }
+    h();
+    const m = o((v) => {
+      v.type === "STORE_METRICS" && v.storeId === e && (i(v.metrics), u(!1));
+    });
+    return S > 0 && (l.current = setInterval(h, S)), () => {
+      m(), l.current && (clearInterval(l.current), l.current = null);
+    };
+  }, [e, o, h, S]), { metrics: c, loading: a, refresh: h };
+}
+function $e() {
+  const { subscribe: e } = j(), [s, r] = k([]);
+  return M(() => e((t) => {
+    switch (t.type) {
+      case "STORE_REGISTRY":
+        r(t.stores);
+        break;
+      case "STORE_CONNECTED":
+        r((c) => c.some((a) => a.id === t.store.id) ? c.map(
+          (a) => a.id === t.store.id ? { ...a, status: "connected" } : a
+        ) : [
+          ...c,
+          {
+            id: t.store.id,
+            name: t.store.name,
+            status: "connected",
+            capabilities: t.store.capabilities,
+            connectedAt: t.timestamp
+          }
+        ]);
+        break;
+      case "STORE_DISCONNECTED":
+        r(
+          (c) => c.map(
+            (i) => i.id === t.storeId ? { ...i, status: "disconnected" } : i
+          )
+        );
+        break;
+    }
+  }), [e]), s;
+}
+function Z(e, s) {
+  let r = e;
+  for (const o of s) {
+    const t = Ce(o.path);
+    switch (o.op) {
+      case "add":
+        r = ee(r, t, o.value, !0);
+        break;
+      case "replace":
+        r = ee(r, t, o.value, !1);
+        break;
+      case "remove":
+        r = pe(r, t);
+        break;
+    }
+  }
+  return r;
+}
+function Ce(e) {
+  return e === "" || e === "/" ? [] : e.slice(1).split("/").map((s) => s.replace(/~1/g, "/").replace(/~0/g, "~"));
+}
+const Ee = /* @__PURE__ */ new Set(["__proto__", "constructor", "prototype"]);
+function ee(e, s, r, o) {
+  if (s.length === 0) return r;
+  const t = Array.isArray(e) ? [...e] : { ...e }, [c, ...i] = s;
+  if (Ee.has(c)) return t;
+  if (i.length === 0)
+    if (o && Array.isArray(t)) {
+      const a = c === "-" ? t.length : Number(c);
+      Number.isInteger(a) && a >= 0 && a <= t.length ? t.splice(a, 0, r) : t[c] = r;
+    } else
+      t[c] = r;
+  else
+    t[c] = ee(t[c] ?? {}, i, r, o);
+  return t;
+}
+function pe(e, s) {
+  if (s.length === 0) return;
+  const r = Array.isArray(e) ? [...e] : { ...e }, [o, ...t] = s;
+  return Ee.has(o) || (t.length === 0 ? Array.isArray(r) ? r.splice(Number(o), 1) : delete r[o] : r[o] = pe(r[o], t)), r;
+}
+function ge(e) {
+  const s = e.scheduler ?? {
+    setInterval: (t, c) => setInterval(t, c),
+    clearInterval: (t) => clearInterval(t)
+  };
+  let r = s.setInterval(() => {
+    if (e.isSettled()) {
+      o();
+      return;
+    }
+    e.request();
+  }, e.intervalMs);
+  function o() {
+    r !== null && (s.clearInterval(r), r = null);
+  }
+  return o;
+}
+const Pe = 1500;
+function Je(e) {
+  const { send: s, subscribe: r, extensionId: o } = j(), [t, c] = k(null), [i, a] = k(0), [u, S] = k(!1), l = A(0), h = A([]), m = A(null), v = O(() => {
+    m.current?.(), m.current = null;
+  }, []), T = O(() => {
+    e && (S(!0), s({
+      type: "REQUEST_STATE",
+      storeId: e,
+      timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+      sourceId: o,
+      sourceRole: b.EXTENSION
+    }));
+  }, [e, s, o]);
+  return M(() => {
+    if (!e) {
+      c(null), a(0), l.current = 0;
+      return;
+    }
+    T(), m.current = ge({
+      request: T,
+      isSettled: () => l.current !== 0,
+      intervalMs: Pe
+    });
+    const N = r((E) => {
+      if (E.type === "STATE_SNAPSHOT" && E.storeId === e) {
+        v(), c(E.state), a(E.version), l.current = E.version, S(!1);
+        const R = h.current.filter((x) => x.version > E.version).sort((x, g) => x.version - g.version);
+        if (h.current = [], R.length > 0) {
+          c((g) => {
+            let I = g;
+            for (const d of R)
+              I = Z(I, d.patches);
+            return I;
+          });
+          const x = R[R.length - 1].version;
+          a(x), l.current = x;
+        }
+        return;
+      }
+      if (E.type === "STORE_EVENT" && E.storeId === e && E.committed) {
+        if (l.current === 0) {
+          h.current.push({
+            patches: E.patches,
+            version: E.snapshotVersion
+          });
+          return;
+        }
+        if (E.snapshotVersion <= l.current)
+          return;
+        c((R) => Z(R, E.patches)), a(E.snapshotVersion), l.current = E.snapshotVersion;
+      }
+    });
+    return () => {
+      N(), v(), h.current = [];
+    };
+  }, [e, r, T, v]), { state: t, version: i, loading: u, refresh: T };
+}
+function qe(e) {
+  const { send: s, subscribe: r, extensionId: o } = j(), [t, c] = k(null), [i, a] = k(!1), u = O(() => {
+    e && (a(!0), s({
+      type: "REQUEST_SUBSCRIPTIONS",
+      storeId: e,
+      timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+      sourceId: o,
+      sourceRole: b.EXTENSION
+    }));
+  }, [e, s, o]);
+  return M(() => {
+    if (!e) {
+      c(null);
+      return;
+    }
+    return u(), r((l) => {
+      l.type === "STORE_SUBSCRIPTIONS" && l.storeId === e && (c({
+        atomic: l.atomic,
+        event: l.event,
+        coarse: l.coarse,
+        effects: l.effects,
+        middleware: l.middleware,
+        reducers: l.reducers
+      }), a(!1));
+    });
+  }, [e, r, u]), { data: t, loading: i, refresh: u };
+}
+function le(e, s) {
+  const { isTimeTraveling: r, currentIndex: o, entryCount: t } = s, c = t - 1;
+  if (e === "back") {
+    const u = (r ? o : c) - 1;
+    return u >= 0 ? { kind: "jump", index: u } : { kind: "none" };
+  }
+  if (!r) return { kind: "none" };
+  const i = o + 1;
+  return i > c ? { kind: "resume" } : { kind: "jump", index: i };
+}
+function De(e) {
+  const { baseline: s, entries: r, index: o, cache: t } = e;
+  if (s === null) return { state: null, cache: null };
+  let c = 0, i = s.state;
+  t !== null && t.index <= o && r[t.index] === t.marker && (c = t.index + 1, i = t.state);
+  for (let u = c; u <= o; u++) {
+    const S = r[u];
+    if (S === void 0) break;
+    S.snapshotVersion <= s.version || (i = Z(i, S.patches));
+  }
+  const a = r[o];
+  return {
+    state: i,
+    cache: o >= 0 && a !== void 0 ? { index: o, state: i, marker: a } : null
+  };
+}
+function We(e, s, r = !0) {
+  const { send: o, subscribe: t, extensionId: c } = j(), [i, a] = k(-1), [u, S] = k(!1), [l, h] = k(null), m = A(null), v = A(null);
+  M(() => {
+    if (m.current = null, v.current = null, h(null), !!e)
+      return t((d) => {
+        d.type === "STATE_SNAPSHOT" && d.storeId === e && m.current === null && (m.current = { state: d.state, version: d.version });
+      });
+  }, [e, t]);
+  const T = O(
+    (d) => {
+      const { state: w, cache: C } = De({
+        baseline: m.current,
+        entries: s,
+        index: d,
+        cache: v.current
+      });
+      return v.current = C, w;
+    },
+    [s]
+  ), N = O(
+    (d) => {
+      if (!e || !r || d < 0 || d >= s.length) return;
+      h((C) => C ?? s.length), a(d), S(!0);
+      const w = s[d];
+      o({
+        type: "TIME_TRAVEL",
+        storeId: e,
+        state: T(d),
+        snapshotVersion: w.snapshotVersion,
+        timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+        sourceId: c,
+        sourceRole: b.EXTENSION
+      });
+    },
+    [e, s, o, T, r, c]
+  ), E = O(() => {
+    if (S(!1), a(-1), h(null), r && e && s.length > 0) {
+      const d = s.length - 1, w = s[d];
+      o({
+        type: "TIME_TRAVEL",
+        storeId: e,
+        state: T(d),
+        snapshotVersion: w.snapshotVersion,
+        timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+        sourceId: c,
+        sourceRole: b.EXTENSION
+      });
+    }
+  }, [e, s, o, T, r, c]), R = l ?? s.length, x = O(() => {
+    const d = le("back", {
+      isTimeTraveling: u,
+      currentIndex: i,
+      entryCount: R
+    });
+    d.kind === "jump" && N(d.index);
+  }, [u, i, R, N]), g = O(() => {
+    const d = le("forward", {
+      isTimeTraveling: u,
+      currentIndex: i,
+      entryCount: R
+    });
+    d.kind === "jump" ? N(d.index) : d.kind === "resume" && E();
+  }, [u, i, R, N, E]), I = Oe(
+    () => T(u ? i : s.length - 1),
+    [T, u, i, s.length]
+  );
+  return {
+    currentIndex: i,
+    isTimeTraveling: u,
+    previewState: I,
+    frameCount: l,
+    jumpTo: N,
+    stepBack: x,
+    stepForward: g,
+    resume: E
+  };
+}
+const z = 0, Q = 1, je = 2, F = 3;
+function $() {
+  return {
+    timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+    sourceId: "loopback-hub",
+    sourceRole: b.HUB
+  };
+}
+function fe(e) {
+  return e.split(".")[0] ?? "0";
+}
+class Me {
+  constructor() {
+    this.peers = /* @__PURE__ */ new Set();
+  }
+  add(s) {
+    const r = { role: null, id: null, deliver: s, closed: !1 };
+    return this.peers.add(r), r;
+  }
+  remove(s) {
+    if (this.peers.delete(s) && (s.closed = !0, s.role === b.STORE && s.id)) {
+      const r = JSON.stringify({
+        type: "STORE_DISCONNECTED",
+        storeId: s.id,
+        reason: "disconnected",
+        ...$()
+      });
+      this.eachExtension((o) => o.deliver(r));
+    }
+  }
+  receive(s, r) {
+    if (s.closed) return;
+    let o;
+    try {
+      o = JSON.parse(r);
+    } catch {
+      return;
+    }
+    if (!(o === null || typeof o != "object" || typeof o.type != "string")) {
+      if (s.role === null) {
+        this.handshake(s, o);
+        return;
+      }
+      if (s.role === b.STORE)
+        this.eachExtension((t) => t.deliver(r));
+      else if (typeof o.storeId == "string")
+        for (const t of this.peers)
+          t.role === b.STORE && t.id === o.storeId && t.deliver(r);
+    }
+  }
+  handshake(s, r) {
+    if (r.type !== "HANDSHAKE_REQUEST") return;
+    const o = r.role, t = o === b.STORE ? r.store?.id : o === b.EXTENSION ? r.extension?.id : void 0, i = fe(String(r.protocolVersion ?? "")) === fe(K) && typeof t == "string";
+    if (s.deliver(
+      JSON.stringify({
+        type: "HANDSHAKE_RESPONSE",
+        success: i,
+        // `negotiatedVersion`, the name the interface and the real hub use. This sent
+        // `protocolVersion` instead — harmless only for as long as nothing reads it, and the
+        // moment something did, the embedded panel would have failed where the real hub worked,
+        // in the one path with no server to inspect.
+        negotiatedVersion: K,
+        ...$(),
+        ...i ? {} : { error: "Loopback handshake rejected (version or id mismatch)" }
+      })
+    ), !!i)
+      if (s.role = o, s.id = t, o === b.STORE) {
+        s.storeInfo = { name: r.store?.name ?? t, capabilities: r.store?.capabilities };
+        const a = JSON.stringify({
+          type: "STORE_CONNECTED",
+          store: { id: t, name: s.storeInfo.name, capabilities: s.storeInfo.capabilities },
+          ...$()
+        });
+        this.eachExtension((u) => u.deliver(a));
+      } else {
+        const a = [...this.peers].filter((u) => u.role === b.STORE && u.storeInfo).map((u) => ({
+          id: u.id,
+          name: u.storeInfo.name,
+          status: "connected",
+          capabilities: u.storeInfo.capabilities,
+          connectedAt: (/* @__PURE__ */ new Date()).toISOString()
+        }));
+        s.deliver(JSON.stringify({ type: "STORE_REGISTRY", stores: a, ...$() }));
+      }
+  }
+  eachExtension(s) {
+    for (const r of this.peers) r.role === b.EXTENSION && s(r);
+  }
+}
+function Ge() {
+  const e = new Me(), s = (t, c) => {
+    let i = z;
+    const a = e.add((u) => c.onMessage(u));
+    return queueMicrotask(() => {
+      i = Q, c.onOpen();
+    }), {
+      get readyState() {
+        return i;
+      },
+      send: (u) => e.receive(a, u),
+      close: () => {
+        i !== F && (i = F, e.remove(a), c.onClose());
+      },
+      dispose: () => {
+        a.closed = !0;
+      }
+    };
+  }, o = class o {
+    constructor(c) {
+      this.onopen = null, this.onmessage = null, this.onclose = null, this.onerror = null, this.readyState = z, this.peer = e.add((i) => this.onmessage?.({ data: i })), queueMicrotask(() => {
+        this.readyState = Q, this.onopen?.();
+      });
+    }
+    send(c) {
+      e.receive(this.peer, c);
+    }
+    close() {
+      this.readyState !== F && (this.readyState = F, e.remove(this.peer), this.onclose?.());
+    }
+  };
+  o.CONNECTING = z, o.OPEN = Q, o.CLOSING = je, o.CLOSED = F;
+  let r = o;
+  return {
+    agentSocketFactory: s,
+    WebSocket: r
+  };
+}
+export {
+  de as HubContext,
+  Le as HubProvider,
+  Z as applyPatches,
+  Ge as createLoopbackHub,
+  Ue as useEventEmitter,
+  Fe as useEventLog,
+  He as useEventReplay,
+  j as useHubConnection,
+  Xe as useStoreMetrics,
+  $e as useStoreRegistry,
+  Je as useStoreState,
+  qe as useStoreSubscriptions,
+  We as useTimeTravel
+};
+//# sourceMappingURL=devtools-ui.mjs.map