@soba-so/react 0.0.1

package/dist/index.mjs

@@ -0,0 +1,930 @@
+"use client"
+
+// ../connect-ui/src/client.ts
+var ConnectError = class extends Error {
+  status;
+  constructor(message, status) {
+    super(message);
+    this.name = "ConnectError";
+    this.status = status;
+  }
+};
+var ConnectClient = class {
+  session;
+  baseUrl;
+  doFetch;
+  constructor(opts) {
+    this.session = opts.session;
+    this.baseUrl = (opts.baseUrl ?? "").replace(/\/+$/, "");
+    this.doFetch = opts.fetchImpl ?? fetch.bind(globalThis);
+  }
+  context() {
+    return this.request("GET", "/v1/connect");
+  }
+  async machines() {
+    const body = await this.request("GET", "/v1/machines");
+    return body.machines;
+  }
+  lookup(code) {
+    return this.request("GET", `/v1/device/lookup?code=${encodeURIComponent(code)}`);
+  }
+  approve(code) {
+    return this.request("POST", "/v1/device/approve", { user_code: code });
+  }
+  deny(code) {
+    return this.request("POST", "/v1/device/deny", { user_code: code });
+  }
+  /** Let a runtime that appeared after pairing start serving. It can only ever
+   *  widen this machine's own advertisement, never its grant. */
+  approveRuntime(machineId, runtimeId) {
+    return this.request("POST", "/v1/runtimes/approve", {
+      machine_id: machineId,
+      runtime_id: runtimeId
+    });
+  }
+  async request(method, path, body) {
+    const res = await this.doFetch(`${this.baseUrl}${path}`, {
+      method,
+      headers: {
+        // In a header, never a query string. The session came out of a URL
+        // fragment for the same reason: a query string reaches access logs,
+        // proxy logs and the `Referer` of every link on the page.
+        authorization: `Bearer ${this.session}`,
+        ...body ? { "content-type": "application/json" } : {}
+      },
+      ...body ? { body: JSON.stringify(body) } : {}
+    });
+    let payload = {};
+    try {
+      payload = await res.json();
+    } catch {
+    }
+    if (!res.ok) {
+      const message = typeof payload.error === "string" ? payload.error : `Request failed (${res.status})`;
+      throw new ConnectError(message, res.status);
+    }
+    return payload;
+  }
+};
+function authLabel(runtime) {
+  if (runtime.authenticated === true) return { tone: "ok", text: "signed in" };
+  if (runtime.authenticated === false) {
+    return { tone: "warn", text: runtime.auth_hint ?? "signed out on that machine" };
+  }
+  return { tone: "unknown", text: "could not tell" };
+}
+function stateLabel(machine) {
+  if (machine.state === "busy")
+    return { tone: "busy", text: `serving ${machine.active} of ${machine.capacity}` };
+  if (machine.state === "online") return { tone: "ok", text: "connected" };
+  return { tone: "off", text: "asleep or offline" };
+}
+
+// ../connect-ui/src/ComputeStatus.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function ComputeStatus({
+  machines,
+  onApproveRuntime
+}) {
+  if (!machines.length) {
+    return /* @__PURE__ */ jsx("p", { className: "sc-note", children: "Nothing connected yet." });
+  }
+  return /* @__PURE__ */ jsx("div", { children: machines.map((m) => {
+    const state = stateLabel(m);
+    return /* @__PURE__ */ jsxs("div", { className: "sc-machine", children: [
+      /* @__PURE__ */ jsxs("div", { className: "sc-row-between", children: [
+        /* @__PURE__ */ jsxs("div", { className: "sc-row", children: [
+          /* @__PURE__ */ jsx("span", { className: `sc-dot sc-dot-${state.tone}`, "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx("strong", { children: m.label ?? "This machine" })
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "sc-note", children: state.text })
+      ] }),
+      /* @__PURE__ */ jsx("p", { className: "sc-note", children: [m.platform, m.arch, m.version && `worker ${m.version}`, m.always_on && "always on"].filter(Boolean).join(" \xB7 ") }),
+      /* @__PURE__ */ jsxs("ul", { className: "sc-runtimes", children: [
+        m.runtimes.map((r) => {
+          const auth = authLabel(r);
+          if (r.quarantined) {
+            return /* @__PURE__ */ jsxs("li", { className: "sc-row-between", children: [
+              /* @__PURE__ */ jsx("span", { children: r.display_name }),
+              onApproveRuntime ? /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  className: "sc-btn",
+                  onClick: () => onApproveRuntime(m.id, r.id),
+                  children: "New here. Let it serve"
+                }
+              ) : /* @__PURE__ */ jsx("span", { className: "sc-tone-warn", children: "new, not serving yet" })
+            ] }, r.id);
+          }
+          return /* @__PURE__ */ jsxs("li", { className: "sc-row-between", children: [
+            /* @__PURE__ */ jsx("span", { children: r.display_name }),
+            /* @__PURE__ */ jsx("span", { className: `sc-tone-${auth.tone}`, children: auth.text })
+          ] }, r.id);
+        }),
+        !m.runtimes.length && /* @__PURE__ */ jsx("li", { className: "sc-note", children: "No runtime advertised. Install Claude Code, Codex or Ollama on that machine." })
+      ] })
+    ] }, m.id);
+  }) });
+}
+
+// ../connect-ui/src/ConnectPanel.tsx
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+
+// ../connect-ui/src/runtimes.ts
+var RUNTIME_CHOICES = [
+  {
+    id: "claude",
+    title: "The Claude plan you already pay for",
+    cost: "Nothing beyond the plan",
+    prerequisite: "Claude Code installed, and signed in",
+    hint: "Install it from claude.ai/code, then run `claude` once and sign in.",
+    expects: ["claude-code"]
+  },
+  {
+    id: "chatgpt",
+    title: "The ChatGPT plan you already pay for",
+    cost: "Nothing beyond the plan",
+    prerequisite: "Codex installed, and signed in",
+    hint: "Install Codex, then run `codex` once and sign in.",
+    expects: ["codex"]
+  },
+  {
+    id: "local",
+    title: "A model on your own machine",
+    cost: "Free. You bought the hardware",
+    prerequisite: "Ollama running, with a model pulled",
+    hint: "Install Ollama, then `ollama pull` a model before pairing.",
+    expects: ["ollama", "openai-api"]
+  }
+];
+
+// ../connect-ui/src/ConnectPanel.tsx
+import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var POLL_MS = 2e3;
+var STATUS_POLL_MS = 1e4;
+function ConnectPanel({
+  client,
+  initialCode,
+  onConnected,
+  showStatus = true
+}) {
+  const [phase, setPhase] = useState("loading");
+  const [context, setContext] = useState(null);
+  const [machines, setMachines] = useState([]);
+  const [choice, setChoice] = useState(null);
+  const [code, setCode] = useState(initialCode ?? "");
+  const [pending, setPending] = useState(null);
+  const [error, setError] = useState(null);
+  const [busy, setBusy] = useState(false);
+  const baseline = useRef(null);
+  useEffect(() => {
+    let live = true;
+    Promise.all([client.context(), client.machines()]).then(([ctx, list]) => {
+      if (!live) return;
+      setContext(ctx);
+      setMachines(list);
+      baseline.current = new Set(list.map((m) => m.id));
+      if (initialCode) setPhase("code");
+      else if (showStatus && list.length > 0) setPhase("manage");
+      else setPhase("choose");
+    }).catch((err) => {
+      if (!live) return;
+      setError(err.message);
+      setPhase("choose");
+    });
+    return () => {
+      live = false;
+    };
+  }, [client, initialCode, showStatus]);
+  useEffect(() => {
+    if (phase !== "manage") return;
+    let live = true;
+    const timer = setInterval(async () => {
+      try {
+        const list = await client.machines();
+        if (live) setMachines(list);
+      } catch {
+      }
+    }, STATUS_POLL_MS);
+    return () => {
+      live = false;
+      clearInterval(timer);
+    };
+  }, [phase, client]);
+  useEffect(() => {
+    if (phase !== "waiting") return;
+    let live = true;
+    const timer = setInterval(async () => {
+      try {
+        const list = await client.machines();
+        if (!live) return;
+        setMachines(list);
+        const fresh = list.filter((m) => !baseline.current?.has(m.id));
+        const arrived = fresh.find((m) => m.state !== "offline") ?? fresh[0];
+        if (arrived) {
+          setPhase("connected");
+          onConnected?.(list);
+        }
+      } catch {
+      }
+    }, POLL_MS);
+    return () => {
+      live = false;
+      clearInterval(timer);
+    };
+  }, [phase, client, onConnected]);
+  const lookup = useCallback(async () => {
+    setError(null);
+    setBusy(true);
+    try {
+      const found = await client.lookup(code);
+      setPending(found);
+      setPhase("confirm");
+    } catch (err) {
+      setError(err.message);
+    } finally {
+      setBusy(false);
+    }
+  }, [client, code]);
+  const approve = useCallback(async () => {
+    setError(null);
+    setBusy(true);
+    try {
+      await client.approve(code);
+      setPhase("waiting");
+    } catch (err) {
+      setError(err.message);
+    } finally {
+      setBusy(false);
+    }
+  }, [client, code]);
+  const deny = useCallback(async () => {
+    setBusy(true);
+    try {
+      await client.deny(code);
+      setPhase("denied");
+    } catch (err) {
+      setError(err.message);
+    } finally {
+      setBusy(false);
+    }
+  }, [client, code]);
+  const command = useMemo(() => context?.command ?? null, [context]);
+  const approveRuntime = useCallback(
+    async (machineId, runtimeId) => {
+      try {
+        await client.approveRuntime(machineId, runtimeId);
+        setMachines(await client.machines());
+      } catch (err) {
+        setError(err.message);
+      }
+    },
+    [client]
+  );
+  if (phase === "loading") {
+    return /* @__PURE__ */ jsx2("div", { className: "soba-connect", children: /* @__PURE__ */ jsx2("div", { className: "sc-card", children: /* @__PURE__ */ jsx2("p", { className: "sc-note", children: "Loading\u2026" }) }) });
+  }
+  return /* @__PURE__ */ jsxs2("div", { className: "soba-connect", children: [
+    phase === "manage" && /* @__PURE__ */ jsxs2("div", { className: "sc-card", children: [
+      /* @__PURE__ */ jsx2("h2", { className: "sc-title", children: "Your compute" }),
+      /* @__PURE__ */ jsxs2("p", { className: "sc-sub", children: [
+        context?.app.name ?? "This app",
+        " runs on these machines, while they are awake."
+      ] }),
+      /* @__PURE__ */ jsx2(ComputeStatus, { machines, onApproveRuntime: approveRuntime }),
+      error && /* @__PURE__ */ jsx2("p", { className: "sc-error", children: error }),
+      /* @__PURE__ */ jsx2(
+        "button",
+        {
+          type: "button",
+          className: "sc-btn",
+          style: { marginTop: 16 },
+          onClick: () => setPhase("choose"),
+          children: "Connect another machine"
+        }
+      )
+    ] }),
+    phase === "choose" && /* @__PURE__ */ jsxs2("div", { className: "sc-card", children: [
+      /* @__PURE__ */ jsx2("h2", { className: "sc-title", children: "Use the AI you already pay for" }),
+      /* @__PURE__ */ jsxs2("p", { className: "sc-sub", children: [
+        context?.app.name ?? "This app",
+        " can run on your machine instead of selling you credits. Pick what you already have."
+      ] }),
+      /* @__PURE__ */ jsx2("div", { className: "sc-choices", children: RUNTIME_CHOICES.map((c) => /* @__PURE__ */ jsxs2(
+        "button",
+        {
+          type: "button",
+          className: "sc-choice",
+          "aria-pressed": choice?.id === c.id,
+          onClick: () => setChoice(c),
+          children: [
+            /* @__PURE__ */ jsx2("span", { className: "sc-choice-title", children: c.title }),
+            /* @__PURE__ */ jsx2("br", {}),
+            /* @__PURE__ */ jsxs2("span", { className: "sc-choice-meta", children: [
+              c.cost,
+              " \xB7 ",
+              c.prerequisite
+            ] })
+          ]
+        },
+        c.id
+      )) }),
+      choice && /* @__PURE__ */ jsxs2("div", { className: "sc-stack", style: { marginTop: 16 }, children: [
+        /* @__PURE__ */ jsx2("p", { className: "sc-note", children: choice.hint }),
+        command ? /* @__PURE__ */ jsxs2(Fragment, { children: [
+          /* @__PURE__ */ jsx2("p", { className: "sc-label", children: "Run this on the machine you want to use" }),
+          /* @__PURE__ */ jsx2("code", { className: "sc-code", children: command }),
+          /* @__PURE__ */ jsx2("p", { className: "sc-note", children: "It will show you a short code. Nothing is pasted back: the credential is written straight to that machine." }),
+          /* @__PURE__ */ jsx2(
+            "button",
+            {
+              type: "button",
+              className: "sc-btn sc-btn-primary",
+              onClick: () => setPhase("code"),
+              children: "I have a code"
+            }
+          )
+        ] }) : /* @__PURE__ */ jsx2("p", { className: "sc-error", children: "This app has no publishable key yet, so there is nothing to pair against." })
+      ] })
+    ] }),
+    phase === "code" && /* @__PURE__ */ jsxs2("div", { className: "sc-card", children: [
+      /* @__PURE__ */ jsx2("h2", { className: "sc-title", children: "Enter the code from your terminal" }),
+      /* @__PURE__ */ jsx2("p", { className: "sc-sub", children: "Eight characters, shown after you ran the command." }),
+      /* @__PURE__ */ jsxs2(
+        "form",
+        {
+          className: "sc-stack",
+          onSubmit: (e) => {
+            e.preventDefault();
+            void lookup();
+          },
+          children: [
+            /* @__PURE__ */ jsx2(
+              "input",
+              {
+                className: "sc-input",
+                value: code,
+                onChange: (e) => setCode(e.target.value),
+                placeholder: "ACDE-F234",
+                autoComplete: "off",
+                autoFocus: true,
+                "aria-label": "Pairing code"
+              }
+            ),
+            error && /* @__PURE__ */ jsx2("p", { className: "sc-error", children: error }),
+            /* @__PURE__ */ jsx2(
+              "button",
+              {
+                type: "submit",
+                className: "sc-btn sc-btn-primary",
+                disabled: busy || code.length < 8,
+                children: busy ? "Checking\u2026" : "Continue"
+              }
+            )
+          ]
+        }
+      )
+    ] }),
+    phase === "confirm" && pending && /* @__PURE__ */ jsxs2("div", { className: "sc-card", children: [
+      /* @__PURE__ */ jsx2("h2", { className: "sc-title", children: "Attach this machine to your account?" }),
+      /* @__PURE__ */ jsxs2("p", { className: "sc-sub", children: [
+        "Once you approve, ",
+        context?.app.name ?? "this app",
+        " may send your runs to it. It can never see the account or the keys on it."
+      ] }),
+      /* @__PURE__ */ jsxs2("ul", { className: "sc-facts", children: [
+        /* @__PURE__ */ jsx2(Fact, { k: "Code", v: pending.user_code }),
+        /* @__PURE__ */ jsx2(Fact, { k: "Machine", v: pending.hostname ?? "not stated" }),
+        /* @__PURE__ */ jsx2(
+          Fact,
+          {
+            k: "System",
+            v: [pending.platform, pending.arch].filter(Boolean).join(" / ") || "not stated"
+          }
+        ),
+        /* @__PURE__ */ jsx2(Fact, { k: "Asked by", v: pending.client ?? "not stated" }),
+        pending.labels.length > 0 && /* @__PURE__ */ jsx2(Fact, { k: "Labels", v: pending.labels.join(", ") })
+      ] }),
+      /* @__PURE__ */ jsx2("p", { className: "sc-note", style: { marginTop: 12 }, children: "Every line above is what that machine said about itself. If none of it looks like a computer of yours, say no." }),
+      error && /* @__PURE__ */ jsx2("p", { className: "sc-error", children: error }),
+      /* @__PURE__ */ jsxs2("div", { className: "sc-row", style: { marginTop: 16 }, children: [
+        /* @__PURE__ */ jsx2(
+          "button",
+          {
+            type: "button",
+            className: "sc-btn sc-btn-primary",
+            onClick: () => void approve(),
+            disabled: busy,
+            children: "Approve"
+          }
+        ),
+        /* @__PURE__ */ jsx2("button", { type: "button", className: "sc-btn", onClick: () => void deny(), disabled: busy, children: "No, deny it" })
+      ] })
+    ] }),
+    phase === "waiting" && /* @__PURE__ */ jsxs2("div", { className: "sc-card", children: [
+      /* @__PURE__ */ jsx2("h2", { className: "sc-title", children: "Approved. Waiting for it to connect\u2026" }),
+      /* @__PURE__ */ jsx2("p", { className: "sc-sub", children: "The worker is starting on that machine. This page will change on its own the moment it arrives." }),
+      /* @__PURE__ */ jsx2("p", { className: "sc-note", children: "If nothing happens, look at the terminal you ran the command in: it says what it is doing." })
+    ] }),
+    phase === "connected" && /* @__PURE__ */ jsxs2("div", { className: "sc-card", children: [
+      /* @__PURE__ */ jsx2("h2", { className: "sc-title", children: "Connected" }),
+      /* @__PURE__ */ jsxs2("p", { className: "sc-sub", children: [
+        context?.app.name ?? "This app",
+        " will use this machine from now on, while it is awake."
+      ] }),
+      showStatus && /* @__PURE__ */ jsxs2(Fragment, { children: [
+        /* @__PURE__ */ jsx2(ComputeStatus, { machines, onApproveRuntime: approveRuntime }),
+        /* @__PURE__ */ jsx2(
+          "button",
+          {
+            type: "button",
+            className: "sc-btn",
+            style: { marginTop: 16 },
+            onClick: () => setPhase("manage"),
+            children: "Done"
+          }
+        )
+      ] })
+    ] }),
+    phase === "denied" && /* @__PURE__ */ jsxs2("div", { className: "sc-card", children: [
+      /* @__PURE__ */ jsx2("h2", { className: "sc-title", children: "Declined" }),
+      /* @__PURE__ */ jsx2("p", { className: "sc-sub", children: "That machine was not attached to your account, and the terminal has been told so." })
+    ] })
+  ] });
+}
+function Fact({ k, v }) {
+  return /* @__PURE__ */ jsxs2("li", { className: "sc-fact", children: [
+    /* @__PURE__ */ jsx2("span", { className: "sc-fact-key", children: k }),
+    /* @__PURE__ */ jsx2("span", { children: v })
+  ] });
+}
+
+// src/context.ts
+import { createContext, useContext } from "react";
+var SobaContext = createContext(null);
+function useSoba() {
+  const value = useContext(SobaContext);
+  if (!value) {
+    throw new Error("useSoba() must be used inside a <SobaProvider>.");
+  }
+  return value;
+}
+
+// src/ComputeStatus.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+function ComputeStatus2({ className }) {
+  const { compute } = useSoba();
+  const classes = className ? `soba-connect ${className}` : "soba-connect";
+  if (compute.loading && !compute.machines.length) {
+    return /* @__PURE__ */ jsx3("div", { className: classes, children: /* @__PURE__ */ jsx3("p", { className: "sc-note", children: "Loading\u2026" }) });
+  }
+  if (compute.error && !compute.machines.length) {
+    return /* @__PURE__ */ jsx3("div", { className: classes, children: /* @__PURE__ */ jsx3("p", { className: "sc-error", children: compute.error.message }) });
+  }
+  return /* @__PURE__ */ jsx3("div", { className: classes, children: /* @__PURE__ */ jsx3(ComputeStatus, { machines: compute.machines }) });
+}
+
+// src/internal.ts
+import { createContext as createContext2, useContext as useContext2 } from "react";
+var ClientContext = createContext2(null);
+function useConnectClient() {
+  return useContext2(ClientContext);
+}
+
+// src/ConnectCompute.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+function ConnectCompute({
+  initialCode,
+  onConnected,
+  className,
+  showStatus
+}) {
+  const { error } = useSoba();
+  const client = useConnectClient();
+  if (error) {
+    return /* @__PURE__ */ jsx4("div", { className: wrapper(className), children: /* @__PURE__ */ jsx4("div", { className: "sc-card", children: /* @__PURE__ */ jsx4("p", { className: "sc-error", children: error.message }) }) });
+  }
+  if (!client) {
+    return /* @__PURE__ */ jsx4("div", { className: wrapper(className), children: /* @__PURE__ */ jsx4("div", { className: "sc-card", children: /* @__PURE__ */ jsx4("p", { className: "sc-note", children: "Loading\u2026" }) }) });
+  }
+  return /* @__PURE__ */ jsx4("div", { className, children: /* @__PURE__ */ jsx4(
+    ConnectPanel,
+    {
+      client,
+      ...initialCode ? { initialCode } : {},
+      ...onConnected ? { onConnected } : {},
+      ...showStatus === void 0 ? {} : { showStatus }
+    }
+  ) });
+}
+function wrapper(className) {
+  return className ? `soba-connect ${className}` : "soba-connect";
+}
+
+// src/events.ts
+var EVENT_TYPES = /* @__PURE__ */ new Set(["delta", "thinking", "status", "done", "error"]);
+function parseEvent(raw) {
+  let parsed;
+  try {
+    parsed = JSON.parse(raw);
+  } catch {
+    return null;
+  }
+  if (!parsed || typeof parsed !== "object") return null;
+  const frame = parsed;
+  const body = frame.type === "event" ? frame.event : frame;
+  if (!body || typeof body !== "object") return null;
+  const o = body;
+  if (typeof o.type !== "string" || !EVENT_TYPES.has(o.type)) return null;
+  const event = { type: o.type };
+  if (typeof o.text === "string") event.text = o.text;
+  if (typeof o.message === "string") event.message = o.message;
+  if (typeof o.tool === "string") event.tool = o.tool;
+  if (typeof o.tier === "string") event.tier = o.tier;
+  if (o.usage && typeof o.usage === "object") event.usage = o.usage;
+  return event;
+}
+async function* readEvents(response) {
+  const body = response.body;
+  if (!body) throw new Error("That run response had no body to stream.");
+  const ndjson = (response.headers.get("content-type") ?? "").includes("ndjson");
+  const reader = body.getReader();
+  const decoder = new TextDecoder();
+  let buffer = "";
+  let data = [];
+  try {
+    for (; ; ) {
+      const chunk = await reader.read();
+      if (chunk.done) break;
+      buffer += decoder.decode(chunk.value, { stream: true });
+      for (; ; ) {
+        const nl = buffer.indexOf("\n");
+        if (nl === -1) break;
+        const line = stripCr(buffer.slice(0, nl));
+        buffer = buffer.slice(nl + 1);
+        if (ndjson) {
+          const event = line.trim() ? parseEvent(line) : null;
+          if (event) yield event;
+          continue;
+        }
+        if (line === "") {
+          const payload = data.join("\n");
+          data = [];
+          if (payload === "[DONE]") return;
+          const event = payload ? parseEvent(payload) : null;
+          if (event) yield event;
+          continue;
+        }
+        collect(line, data);
+      }
+    }
+    if (!ndjson && buffer) collect(stripCr(buffer), data);
+    const tail = ndjson ? buffer.trim() : data.join("\n");
+    if (tail && tail !== "[DONE]") {
+      const event = parseEvent(tail);
+      if (event) yield event;
+    }
+  } finally {
+    reader.cancel().catch(() => {
+    });
+  }
+}
+function collect(line, data) {
+  if (!line || line.startsWith(":")) return;
+  const colon = line.indexOf(":");
+  if (colon === -1 || line.slice(0, colon) !== "data") return;
+  const value = line.slice(colon + 1);
+  data.push(value.startsWith(" ") ? value.slice(1) : value);
+}
+function stripCr(line) {
+  return line.endsWith("\r") ? line.slice(0, -1) : line;
+}
+async function collectText(events) {
+  let text = "";
+  for await (const event of events) {
+    if (event.type === "delta" && event.text) text += event.text;
+    if (event.type === "error") throw new Error(event.message ?? "The run ended with an error.");
+  }
+  return text;
+}
+
+// src/SobaProvider.tsx
+import { useCallback as useCallback2, useEffect as useEffect2, useMemo as useMemo2, useRef as useRef2, useState as useState2 } from "react";
+
+// src/session.ts
+var REFRESH_MARGIN_MS = 6e4;
+var MIN_REFRESH_MS = 1e4;
+var SessionHolder = class {
+  #token;
+  #expiresAt = null;
+  #inFlight = null;
+  #options;
+  #listeners = /* @__PURE__ */ new Set();
+  constructor(options) {
+    this.#options = options;
+    this.#token = options.token ?? null;
+  }
+  get token() {
+    return this.#token;
+  }
+  /** When the current token stops working, if the endpoint said. */
+  get expiresAt() {
+    return this.#expiresAt;
+  }
+  /** False for a token handed in directly: there is nowhere to get another. */
+  get canRefresh() {
+    return Boolean(this.#options.endpoint);
+  }
+  /** When to ask for the next one, or null when there is nothing to schedule. */
+  get refreshAt() {
+    if (!this.canRefresh || this.#expiresAt === null) return null;
+    return Math.max(Date.now() + MIN_REFRESH_MS, this.#expiresAt - REFRESH_MARGIN_MS);
+  }
+  subscribe(listener) {
+    this.#listeners.add(listener);
+    return () => this.#listeners.delete(listener);
+  }
+  /** The token, minting one if there is none. Concurrent callers share a
+   *  request: three components mounting together must not mint three sessions. */
+  async ensure() {
+    if (this.#token) return this.#token;
+    return this.refresh();
+  }
+  async refresh() {
+    if (this.#inFlight) return this.#inFlight;
+    const endpoint = this.#options.endpoint;
+    if (!endpoint) {
+      throw new Error(
+        "This Soba session cannot be refreshed. Pass `sessionEndpoint` so the provider can mint a new one."
+      );
+    }
+    const doFetch = this.#options.fetchImpl ?? fetch.bind(globalThis);
+    this.#inFlight = (async () => {
+      const response = await doFetch(endpoint, {
+        method: "POST",
+        headers: { "content-type": "application/json" },
+        // The endpoint is the customer's own, so it authenticates the person the
+        // way the rest of their app does. Their cookies, not our credential.
+        credentials: "same-origin",
+        body: JSON.stringify(this.#options.user ? { user: this.#options.user } : {})
+      });
+      if (!response.ok) {
+        throw new Error(`Could not start a Soba session (${response.status} from ${endpoint}).`);
+      }
+      const body = await response.json();
+      const token = body.session ?? body.token;
+      if (!token) {
+        throw new Error(`${endpoint} answered without a \`session\`. See @soba-so/react's README.`);
+      }
+      const ttl = body.expires_in ?? body.expiresIn;
+      this.#token = token;
+      this.#expiresAt = typeof ttl === "number" ? Date.now() + ttl * 1e3 : null;
+      for (const listener of this.#listeners) listener();
+      return token;
+    })();
+    try {
+      return await this.#inFlight;
+    } finally {
+      this.#inFlight = null;
+    }
+  }
+};
+function createSessionFetch(holder, base = fetch.bind(globalThis)) {
+  return async (input, init) => {
+    const response = await base(input, init);
+    if (response.status !== 401 || !holder.canRefresh) return response;
+    let fresh;
+    try {
+      fresh = await holder.refresh();
+    } catch {
+      return response;
+    }
+    return base(input, withAuthorization(init, fresh));
+  };
+}
+function withAuthorization(init, token) {
+  const headers = new Headers(init?.headers);
+  headers.set("authorization", `Bearer ${token}`);
+  return { ...init, headers };
+}
+
+// src/styles.ts
+var MARKER = "data-soba-react";
+var injected = false;
+function injectStyles() {
+  if (injected || typeof document === "undefined") return;
+  injected = true;
+  if (document.querySelector(`style[${MARKER}]`)) return;
+  const style = document.createElement("style");
+  style.setAttribute(MARKER, "");
+  style.textContent = '/*\n * Self-contained on purpose.\n *\n * This renders inside the Next app, inside a Tauri window, and eventually inside\n * a customer\'s own page, which will have its own reset, its own font stack and\n * quite possibly Tailwind. So: one class prefix, no element selectors, no\n * assumptions about a reset, and every colour behind a token a host can\n * override by redefining it on `.soba-connect`.\n */\n\n.soba-connect {\n  --sc-ground: #ffffff;\n  --sc-sheet: #ffffff;\n  --sc-raised: #f6f6f7;\n  --sc-line: #e9e9eb;\n  --sc-line-2: #dcdce0;\n  --sc-text: #1a1a1c;\n  --sc-text-2: #3f3f46;\n  --sc-muted: #6b6b73;\n  --sc-accent: #18181b;\n  --sc-accent-fg: #ffffff;\n  --sc-ok: #22a06b;\n  --sc-warn: #b06f14;\n  --sc-r: 10px;\n\n  box-sizing: border-box;\n  max-width: 560px;\n  margin: 0 auto;\n  color: var(--sc-text);\n  font-family: "Inter", ui-sans-serif, -apple-system, "Helvetica Neue", Arial, sans-serif;\n  font-size: 15px;\n  line-height: 1.5;\n  letter-spacing: -0.005em;\n}\n.soba-connect *,\n.soba-connect *::before,\n.soba-connect *::after {\n  box-sizing: inherit;\n}\n\n.sc-card {\n  background: var(--sc-sheet);\n  border: 1px solid var(--sc-line);\n  border-radius: var(--sc-r);\n  padding: 20px;\n}\n.sc-card + .sc-card {\n  margin-top: 12px;\n}\n\n.sc-title {\n  font-size: 20px;\n  font-weight: 650;\n  letter-spacing: -0.02em;\n  margin: 0 0 4px;\n}\n.sc-sub {\n  color: var(--sc-muted);\n  margin: 0 0 16px;\n}\n.sc-label {\n  font-size: 13px;\n  color: var(--sc-muted);\n  margin: 0 0 6px;\n  letter-spacing: -0.005em;\n}\n\n.sc-choices {\n  display: grid;\n  gap: 8px;\n}\n.sc-choice {\n  display: block;\n  width: 100%;\n  text-align: left;\n  background: var(--sc-sheet);\n  border: 1px solid var(--sc-line-2);\n  border-radius: var(--sc-r);\n  padding: 12px 14px;\n  cursor: pointer;\n  font: inherit;\n  color: inherit;\n}\n.sc-choice:hover {\n  background: var(--sc-raised);\n}\n.sc-choice[aria-pressed="true"] {\n  border-color: var(--sc-accent);\n  box-shadow: inset 0 0 0 1px var(--sc-accent);\n}\n.sc-choice-title {\n  font-weight: 550;\n}\n.sc-choice-meta {\n  color: var(--sc-muted);\n  font-size: 13px;\n}\n\n.sc-code {\n  display: block;\n  background: var(--sc-raised);\n  border: 1px solid var(--sc-line);\n  border-radius: 8px;\n  padding: 12px 14px;\n  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;\n  font-size: 13px;\n  overflow-x: auto;\n  white-space: pre;\n}\n\n.sc-row {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n.sc-row-between {\n  display: flex;\n  gap: 12px;\n  align-items: center;\n  justify-content: space-between;\n}\n.sc-stack {\n  display: grid;\n  gap: 12px;\n}\n\n.sc-btn {\n  font: inherit;\n  font-weight: 550;\n  border-radius: 8px;\n  padding: 9px 14px;\n  border: 1px solid var(--sc-line-2);\n  background: var(--sc-sheet);\n  color: var(--sc-text);\n  cursor: pointer;\n}\n.sc-btn:hover {\n  background: var(--sc-raised);\n}\n.sc-btn-primary {\n  background: var(--sc-accent);\n  color: var(--sc-accent-fg);\n  border-color: var(--sc-accent);\n}\n.sc-btn-primary:hover {\n  opacity: 0.9;\n  background: var(--sc-accent);\n}\n.sc-btn:disabled {\n  opacity: 0.5;\n  cursor: default;\n}\n\n.sc-input {\n  font: inherit;\n  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  padding: 10px 12px;\n  border: 1px solid var(--sc-line-2);\n  border-radius: 8px;\n  background: var(--sc-sheet);\n  color: inherit;\n  width: 100%;\n}\n\n.sc-dot {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  flex: none;\n  background: var(--sc-muted);\n}\n.sc-dot-ok {\n  background: var(--sc-ok);\n}\n.sc-dot-busy {\n  background: var(--sc-warn);\n}\n.sc-dot-off {\n  background: var(--sc-line-2);\n}\n\n.sc-tone-ok {\n  color: var(--sc-ok);\n}\n.sc-tone-warn {\n  color: var(--sc-warn);\n}\n.sc-tone-unknown {\n  color: var(--sc-muted);\n}\n\n.sc-error {\n  color: var(--sc-warn);\n  font-size: 14px;\n}\n.sc-note {\n  color: var(--sc-muted);\n  font-size: 13px;\n}\n\n.sc-facts {\n  display: grid;\n  gap: 4px;\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n.sc-fact {\n  display: flex;\n  gap: 10px;\n  font-size: 14px;\n}\n.sc-fact-key {\n  color: var(--sc-muted);\n  min-width: 92px;\n}\n\n.sc-machine {\n  border-top: 1px solid var(--sc-line);\n  padding-top: 12px;\n  margin-top: 12px;\n}\n.sc-machine:first-child {\n  border-top: 0;\n  padding-top: 0;\n  margin-top: 0;\n}\n.sc-runtimes {\n  display: grid;\n  gap: 4px;\n  margin: 8px 0 0;\n  padding: 0;\n  list-style: none;\n  font-size: 14px;\n}\n\n@media (prefers-color-scheme: dark) {\n  .soba-connect:not([data-theme="light"]) {\n    --sc-ground: #0f0f11;\n    --sc-sheet: #161618;\n    --sc-raised: #1d1d20;\n    --sc-line: #26262a;\n    --sc-line-2: #34343a;\n    --sc-text: #f2f2f3;\n    --sc-text-2: #c9c9cd;\n    --sc-muted: #8d8d95;\n    --sc-accent: #f2f2f3;\n    --sc-accent-fg: #131316;\n  }\n}\n';
+  document.head.appendChild(style);
+}
+
+// src/SobaProvider.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var DEFAULT_BASE_URL = "https://soba.so";
+var DEFAULT_POLL_MS = 15e3;
+function SobaProvider(props) {
+  const {
+    children,
+    session: given,
+    sessionEndpoint,
+    user,
+    runEndpoint,
+    baseUrl = DEFAULT_BASE_URL,
+    pollMs = DEFAULT_POLL_MS,
+    injectStyles: withStyles = true,
+    fetchImpl,
+    onError
+  } = props;
+  const [session, setSession] = useState2(given ?? null);
+  const [error, setError] = useState2(null);
+  const [context, setContext] = useState2(null);
+  const [contextError, setContextError] = useState2(null);
+  const [contextLoading, setContextLoading] = useState2(true);
+  const [machines, setMachines] = useState2([]);
+  const [machinesError, setMachinesError] = useState2(null);
+  const [machinesLoading, setMachinesLoading] = useState2(true);
+  const report = useRef2(onError);
+  report.current = onError;
+  const fail = useCallback2((err) => {
+    setError(err);
+    report.current?.(err);
+  }, []);
+  useEffect2(() => {
+    if (withStyles) injectStyles();
+  }, [withStyles]);
+  const holder = useMemo2(
+    () => new SessionHolder({
+      ...given ? { token: given } : {},
+      ...sessionEndpoint ? { endpoint: sessionEndpoint } : {},
+      ...user ? { user } : {},
+      ...fetchImpl ? { fetchImpl } : {}
+    }),
+    [given, sessionEndpoint, user, fetchImpl]
+  );
+  useEffect2(() => {
+    let live = true;
+    const unsubscribe = holder.subscribe(() => {
+      if (live) setSession(holder.token);
+    });
+    if (!holder.token && !holder.canRefresh) {
+      fail(
+        new Error(
+          "<SobaProvider> needs a `session` or a `sessionEndpoint`. A browser cannot mint one: that takes your secret key."
+        )
+      );
+    } else {
+      holder.ensure().then(
+        () => live && setSession(holder.token),
+        (err) => live && fail(err)
+      );
+    }
+    return () => {
+      live = false;
+      unsubscribe();
+    };
+  }, [holder, fail]);
+  useEffect2(() => {
+    const at = holder.refreshAt;
+    if (at === null) return;
+    const timer = setTimeout(
+      () => {
+        holder.refresh().catch((err) => fail(err));
+      },
+      Math.max(0, at - Date.now())
+    );
+    return () => clearTimeout(timer);
+  }, [holder, fail, session]);
+  const client = useMemo2(() => {
+    if (!session) return null;
+    return new ConnectClient({
+      session,
+      baseUrl,
+      // Heals a session that died under a request, transparently, for every
+      // consumer of this client, including the connect panel's own polling.
+      fetchImpl: createSessionFetch(holder, fetchImpl ?? fetch.bind(globalThis))
+    });
+  }, [session, baseUrl, holder, fetchImpl]);
+  useEffect2(() => {
+    if (!client) return;
+    let live = true;
+    setContextLoading(true);
+    client.context().then(
+      (value2) => {
+        if (!live) return;
+        setContext(value2);
+        setContextError(null);
+        setContextLoading(false);
+      },
+      (err) => {
+        if (!live) return;
+        setContextError(err);
+        setContextLoading(false);
+      }
+    );
+    return () => {
+      live = false;
+    };
+  }, [client]);
+  const load = useCallback2(async () => {
+    if (!client) return;
+    try {
+      const list = await client.machines();
+      setMachines(list);
+      setMachinesError(null);
+    } catch (err) {
+      setMachinesError(err);
+    } finally {
+      setMachinesLoading(false);
+    }
+  }, [client]);
+  useEffect2(() => {
+    if (!client) return;
+    let live = true;
+    void load();
+    const timer = setInterval(() => {
+      if (typeof document !== "undefined" && document.hidden) return;
+      if (live) void load();
+    }, pollMs);
+    return () => {
+      live = false;
+      clearInterval(timer);
+    };
+  }, [client, load, pollMs]);
+  const run = useCallback2(
+    async (request) => {
+      if (!runEndpoint) {
+        throw new Error(
+          "Pass `runEndpoint` to <SobaProvider> to start runs from the browser. It is your own route: it holds your secret key, calls soba.run(), and forwards the stream."
+        );
+      }
+      const { signal, ...body } = request;
+      const doFetch = fetchImpl ?? fetch.bind(globalThis);
+      const response = await doFetch(runEndpoint, {
+        method: "POST",
+        headers: { "content-type": "application/json", accept: "text/event-stream" },
+        // Your route, your auth. The Soba session is not sent: it says who is
+        // connecting a machine, never who may spend your key.
+        credentials: "same-origin",
+        body: JSON.stringify(body),
+        ...signal ? { signal } : {}
+      });
+      if (!response.ok) {
+        throw new Error(`${runEndpoint} answered ${response.status}.`);
+      }
+      return readEvents(response);
+    },
+    [runEndpoint, fetchImpl]
+  );
+  const value = useMemo2(
+    () => ({
+      session,
+      client,
+      error,
+      compute: {
+        machines,
+        connected: machines.length > 0,
+        online: machines.some((m) => m.state !== "offline"),
+        loading: machinesLoading,
+        error: machinesError,
+        refresh: load
+      },
+      connect: {
+        app: context?.app ?? null,
+        command: context?.command ?? null,
+        publishableKey: context?.publishable_key ?? null,
+        loading: contextLoading,
+        error: contextError
+      },
+      run
+    }),
+    [
+      session,
+      client,
+      error,
+      machines,
+      machinesLoading,
+      machinesError,
+      load,
+      context,
+      contextLoading,
+      contextError,
+      run
+    ]
+  );
+  return /* @__PURE__ */ jsx5(ClientContext.Provider, { value: client, children: /* @__PURE__ */ jsx5(SobaContext.Provider, { value, children }) });
+}
+export {
+  ComputeStatus2 as ComputeStatus,
+  ConnectCompute,
+  SobaProvider,
+  collectText,
+  injectStyles,
+  parseEvent,
+  readEvents,
+  useSoba
+};
+//# sourceMappingURL=index.mjs.map