@better-state/server 0.1.0 → 0.1.1

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,SAAS,CAAC;AAO9B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAYnC,QAAA,MAAM,GAAG,EAAE,UAAU,CAAC,OAAO,OAAO,CAAa,CAAC;AAKlD,QAAA,MAAM,EAAE,+HAEN,CAAC;AAgRH,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,SAAS,CAAC;AAO9B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAYnC,QAAA,MAAM,GAAG,EAAE,UAAU,CAAC,OAAO,OAAO,CAAa,CAAC;AAKlD,QAAA,MAAM,EAAE,+HAEN,CAAC;AAuVH,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC"}

package/dist/index.js

@@ -197,6 +197,14 @@ io.on("connection", (socket) => {
             });
         }
     });
+    socket.on("subscribe:studio", () => {
+        if (!authedNamespace) {
+            socket.emit("auth:error", { message: "Not authenticated" });
+            return;
+        }
+        socket.join(`studio:${authedNamespace}`);
+        console.log(`[ws] studio subscribed: socket=${socket.id} namespace=${authedNamespace}`);
+    });
     socket.on("unsubscribe", (payload) => {
         if (!authedNamespace)
             return;
@@ -214,10 +222,13 @@ io.on("connection", (socket) => {
             const { value, version, mutationIds } = processMutations(db, authedNamespace, payload.key, clientId, payload.mutations);
             socket.emit("mutate:ack", { mutationIds });
             const room = `${authedNamespace}:${payload.key}`;
-            io.to(room).emit("state:update", {
-                key: payload.key,
-                value,
-                version,
+            const studioRoom = `studio:${authedNamespace}`;
+            const updatePayload = { key: payload.key, value, version };
+            io.to(room).emit("state:update", updatePayload);
+            io.to(studioRoom).emit("studio:mutation", {
+                ...updatePayload,
+                clientId,
+                timestamp: Date.now(),
             });
             console.log(`[ws] broadcast: key=${payload.key} version=${version}`);
         }
@@ -233,6 +244,56 @@ io.on("connection", (socket) => {
         clientId = null;
     });
 });
+// ─── Studio API ──────────────────────────────────────────────────────────────
+app.get("/api/v1/studio/stats", (_req, res) => {
+    const namespaces = db.prepare("SELECT COUNT(*) as count FROM namespaces").get();
+    const states = db.prepare("SELECT COUNT(*) as count FROM states").get();
+    const events = db.prepare("SELECT COUNT(*) as count FROM event_log").get();
+    const connectedSockets = io.sockets.sockets.size;
+    res.json({
+        namespaces: namespaces.count,
+        states: states.count,
+        events: events.count,
+        connections: connectedSockets,
+        uptime: process.uptime(),
+    });
+});
+app.get("/api/v1/studio/states", (_req, res) => {
+    const rows = db.prepare(`
+    SELECT s.id, s.namespace, s.key, s.snapshot, s.version, s.created_at, s.updated_at, n.name as namespace_name
+    FROM states s
+    JOIN namespaces n ON s.namespace = n.id
+    ORDER BY s.updated_at DESC
+  `).all();
+    res.json(rows);
+});
+app.get("/api/v1/studio/events/recent", (req, res) => {
+    const limit = parseInt(req.query.limit, 10) || 30;
+    const rows = db.prepare(`
+    SELECT e.id, e.state_id, e.client_id, e.client_ts, e.server_ts, e.mutation, e.meta, s.key as state_key
+    FROM event_log e
+    JOIN states s ON e.state_id = s.id
+    ORDER BY e.server_ts DESC, e.seq DESC
+    LIMIT ?
+  `).all(limit);
+    res.json(rows.reverse());
+});
+const STUDIO_HTML = path.resolve(__dirname, "../public/studio.html");
+app.get("/studio", (_req, res) => {
+    const devKeyPath = process.env.DEV_KEY_PATH || path.resolve(__dirname, "../data/.dev-key");
+    let apiKey = "";
+    try {
+        apiKey = readFileSync(devKeyPath, "utf-8").trim();
+    }
+    catch { /* no dev key */ }
+    if (!existsSync(STUDIO_HTML)) {
+        res.status(404).send("Studio not available");
+        return;
+    }
+    const html = readFileSync(STUDIO_HTML, "utf-8").replace("__API_KEY__", apiKey);
+    res.setHeader("Content-Type", "text/html");
+    res.send(html);
+});
 // ─── Start ───────────────────────────────────────────────────────────────────
 httpServer.listen(PORT, () => {
     console.log(`[better-state] server running on http://localhost:${PORT}`);

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@better-state/server",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Better-State server — shared state primitive for developers",
   "type": "module",
   "bin": {

package/public/playground.html

@@ -9,293 +9,262 @@
 
     body {
       font-family: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;
-      background: #0a0a0f;
+      background: #0a0a12;
       color: #e2e8f0;
       min-height: 100vh;
-      padding: 2rem;
-    }
-
-    .header {
       display: flex;
       align-items: center;
-      gap: 0.75rem;
-      margin-bottom: 2rem;
-    }
-    .header h1 {
-      font-size: 1.5rem;
-      font-weight: 700;
-      letter-spacing: -0.02em;
-    }
-    .header h1 span { color: #36adf6; }
-    .badge {
-      font-size: 0.7rem;
-      background: rgba(12, 147, 231, 0.15);
-      color: #7cc8fb;
-      padding: 0.15rem 0.5rem;
-      border-radius: 9999px;
+      justify-content: center;
+      padding: 1.5rem;
     }
 
-    .status-bar {
-      display: flex;
-      gap: 1.5rem;
-      margin-bottom: 2rem;
-      font-size: 0.85rem;
-      color: #94a3b8;
-    }
-    .status-dot {
-      display: inline-block;
-      width: 8px;
-      height: 8px;
-      border-radius: 50%;
-      margin-right: 0.4rem;
-      vertical-align: middle;
+    .container { width: 100%; max-width: 520px; }
+
+    .header { margin-bottom: 1.5rem; }
+    .header h1 { font-size: 1.5rem; font-weight: 700; letter-spacing: -0.02em; }
+    .header h1 span { color: #38bdf8; }
+    .subtitle { font-size: 0.8rem; color: #64748b; margin-top: 0.25rem; }
+
+    .status {
+      display: flex; align-items: center; gap: 0.4rem;
+      font-size: 0.75rem; color: #94a3b8; margin-bottom: 1.5rem;
     }
-    .status-dot.green { background: #34d399; }
-    .status-dot.red { background: #f87171; }
-    .status-dot.yellow { background: #fbbf24; }
-
-    .grid {
-      display: grid;
-      grid-template-columns: 1fr 1fr;
-      gap: 1.5rem;
-      margin-bottom: 2rem;
+    .dot {
+      width: 7px; height: 7px; border-radius: 50%;
+      transition: background 0.3s;
     }
+    .dot.connecting { background: #fbbf24; animation: pulse 1.2s infinite; }
+    .dot.connected { background: #34d399; }
+    .dot.disconnected { background: #f87171; }
+    @keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }
 
     .card {
-      background: rgba(15, 23, 42, 0.6);
+      background: rgba(15, 23, 42, 0.7);
       border: 1px solid #1e293b;
-      border-radius: 12px;
-      padding: 1.25rem;
-    }
-    .card h2 {
-      font-size: 0.75rem;
-      font-weight: 600;
-      text-transform: uppercase;
-      letter-spacing: 0.05em;
-      color: #64748b;
+      border-radius: 16px;
+      padding: 1.5rem;
       margin-bottom: 1rem;
     }
 
-    .state-display {
-      background: #0f172a;
-      border: 1px solid #1e293b;
-      border-radius: 8px;
-      padding: 1rem;
-      font-family: "JetBrains Mono", "Fira Code", monospace;
-      font-size: 0.85rem;
-      min-height: 120px;
-      white-space: pre-wrap;
-      word-break: break-all;
-      color: #a5b4fc;
-      margin-bottom: 1rem;
+    .card-label {
+      font-size: 0.65rem; font-weight: 600; text-transform: uppercase;
+      letter-spacing: 0.08em; color: #475569; margin-bottom: 1rem;
+    }
+
+    /* Counter */
+    .counter-value {
+      font-size: 4rem; font-weight: 800; text-align: center;
+      color: #38bdf8; padding: 0.5rem 0; transition: transform 0.15s;
+      font-variant-numeric: tabular-nums;
     }
+    .counter-value.bump { transform: scale(1.08); }
 
-    .controls { display: flex; gap: 0.5rem; flex-wrap: wrap; }
-
-    button {
-      background: linear-gradient(135deg, #0c93e7, #015da0);
-      color: white;
-      border: none;
-      padding: 0.5rem 1rem;
-      border-radius: 8px;
-      font-size: 0.8rem;
-      font-weight: 500;
-      cursor: pointer;
-      transition: opacity 0.15s;
+    .btn-row {
+      display: flex; gap: 0.5rem; margin-top: 1rem;
     }
-    button:hover { opacity: 0.85; }
-    button.secondary {
-      background: rgba(30, 41, 59, 0.8);
-      border: 1px solid #334155;
+    .btn {
+      flex: 1; padding: 0.6rem; border-radius: 10px;
+      font-size: 0.9rem; font-weight: 600; cursor: pointer;
+      border: 1px solid #1e293b; background: #1e293b; color: #e2e8f0;
+      transition: background 0.15s, border-color 0.15s;
     }
-    button.danger {
-      background: linear-gradient(135deg, #dc2626, #991b1b);
+    .btn:hover { background: #334155; border-color: #334155; }
+    .btn.primary { background: #2563eb; border-color: #2563eb; }
+    .btn.primary:hover { background: #1d4ed8; border-color: #1d4ed8; }
+    .btn.danger { color: #f87171; }
+    .btn.danger:hover { background: #991b1b22; border-color: #7f1d1d; }
+
+    /* Todos */
+    .todo-input-row { display: flex; gap: 0.5rem; margin-bottom: 0.75rem; }
+    .todo-input {
+      flex: 1; padding: 0.55rem 0.75rem; border-radius: 10px;
+      background: #0f172a; border: 1px solid #334155; color: #e2e8f0;
+      font-size: 0.85rem;
     }
+    .todo-input:focus { outline: none; border-color: #38bdf8; }
 
-    input[type="text"] {
-      background: #0f172a;
-      border: 1px solid #334155;
-      color: #e2e8f0;
-      padding: 0.5rem 0.75rem;
-      border-radius: 8px;
+    .todo-list { list-style: none; }
+    .todo-item {
+      display: flex; align-items: center; gap: 0.6rem;
+      padding: 0.5rem 0; border-bottom: 1px solid #1e293b;
       font-size: 0.85rem;
-      flex: 1;
-      min-width: 180px;
     }
-    input[type="text"]:focus { outline: none; border-color: #36adf6; }
+    .todo-item:last-child { border-bottom: none; }
+    .todo-check {
+      width: 18px; height: 18px; border-radius: 50%;
+      border: 2px solid #475569; cursor: pointer;
+      display: flex; align-items: center; justify-content: center;
+      flex-shrink: 0; transition: all 0.2s;
+    }
+    .todo-check.done { background: #34d399; border-color: #34d399; }
+    .todo-check.done::after { content: "✓"; color: #0a0a12; font-size: 0.7rem; font-weight: 700; }
+    .todo-text { flex: 1; }
+    .todo-text.done { text-decoration: line-through; color: #64748b; }
+    .todo-delete {
+      background: none; border: none; color: #475569; cursor: pointer;
+      font-size: 1rem; padding: 0 0.25rem; transition: color 0.15s;
+    }
+    .todo-delete:hover { color: #f87171; }
+    .empty { color: #475569; font-size: 0.8rem; text-align: center; padding: 1rem 0; }
 
+    /* Log */
     .log {
-      background: #0f172a;
-      border: 1px solid #1e293b;
-      border-radius: 8px;
-      padding: 1rem;
+      background: #0a0a12; border: 1px solid #1e293b; border-radius: 10px;
+      padding: 0.75rem; max-height: 160px; overflow-y: auto;
       font-family: "JetBrains Mono", "Fira Code", monospace;
-      font-size: 0.75rem;
-      max-height: 300px;
-      overflow-y: auto;
-      line-height: 1.6;
-    }
-    .log .entry { margin-bottom: 0.25rem; }
-    .log .ts { color: #475569; }
-    .log .event { color: #34d399; }
-    .log .data { color: #94a3b8; }
-    .log .error { color: #f87171; }
-
-    .hint {
-      font-size: 0.8rem;
-      color: #475569;
-      margin-top: 0.5rem;
-      line-height: 1.5;
+      font-size: 0.7rem; line-height: 1.7;
     }
+    .log-entry .ts { color: #334155; }
+    .log-entry .ev { color: #34d399; }
+    .log-entry .dt { color: #64748b; }
 
-    @media (max-width: 768px) {
-      .grid { grid-template-columns: 1fr; }
+    .footer {
+      text-align: center; font-size: 0.7rem; color: #334155;
+      margin-top: 1.5rem; line-height: 1.6;
     }
+    .footer code { color: #475569; }
   </style>
 </head>
 <body>
-  <div class="header">
-    <h1><span>Better</span>-State</h1>
-    <span class="badge">Playground</span>
-  </div>
+  <div class="container">
+    <div class="header">
+      <h1><span>Better</span>-State</h1>
+      <div class="subtitle">Playground — open in multiple tabs to see real-time sync</div>
+    </div>
 
-  <div class="status-bar">
-    <div><span id="conn-dot" class="status-dot yellow"></span> <span id="conn-text">Connecting...</span></div>
-    <div>Client: <code id="client-id">—</code></div>
-    <div>Version: <code id="version">0</code></div>
-  </div>
+    <div class="status">
+      <div id="dot" class="dot connecting"></div>
+      <span id="status-text">connecting</span>
+    </div>
 
-  <div class="grid">
-    <!-- Counter state -->
+    <!-- Counter -->
     <div class="card">
-      <h2>State: counter</h2>
-      <div id="counter-display" class="state-display">0</div>
-      <div class="controls">
-        <button onclick="increment()">+ Increment</button>
-        <button onclick="decrement()" class="secondary">- Decrement</button>
-        <button onclick="resetCounter()" class="danger">Reset</button>
+      <div class="card-label">Synced Counter</div>
+      <div id="counter" class="counter-value">0</div>
+      <div class="btn-row">
+        <button class="btn" onclick="dec()">- 1</button>
+        <button class="btn danger" onclick="resetCounter()">Reset</button>
+        <button class="btn primary" onclick="inc()">+ 1</button>
       </div>
-      <p class="hint">Click buttons in multiple tabs — they all sync in real-time.</p>
     </div>
 
-    <!-- Todos state -->
+    <!-- Todos -->
     <div class="card">
-      <h2>State: todos</h2>
-      <div id="todos-display" class="state-display">[]</div>
-      <div class="controls">
-        <input id="todo-input" type="text" placeholder="Add a todo..." onkeydown="if(event.key==='Enter') addTodo()" />
-        <button onclick="addTodo()">Add</button>
-        <button onclick="clearTodos()" class="danger">Clear</button>
+      <div class="card-label">Synced Todo List</div>
+      <div class="todo-input-row">
+        <input id="input" class="todo-input" placeholder="Add a todo..." onkeydown="if(event.key==='Enter')addTodo()" />
+        <button class="btn primary" style="flex:none;padding:.55rem .9rem" onclick="addTodo()">Add</button>
       </div>
+      <ul id="list" class="todo-list">
+        <li class="empty">No todos yet</li>
+      </ul>
     </div>
-  </div>
 
-  <!-- Event log -->
-  <div class="card">
-    <h2>Event Log</h2>
-    <div id="log" class="log">
-      <div class="entry"><span class="ts">[init]</span> <span class="data">Waiting for connection...</span></div>
+    <!-- Log -->
+    <div class="card">
+      <div class="card-label">Event Log</div>
+      <div id="log" class="log"></div>
+    </div>
+
+    <div class="footer">
+      State powered by <code>@better-state/client</code><br/>
+      Changes sync instantly across every connected tab
     </div>
   </div>
 
   <script type="module">
-    // --- Config ---
-    // The API key is injected by the server into the page.
     const API_KEY = "__API_KEY__";
-    const SERVER_URL = window.location.origin;
-
-    // --- Load SDK ---
     const { createClient } = await import("/sdk/browser.mjs");
 
-    const log = document.getElementById("log");
-    const connDot = document.getElementById("conn-dot");
-    const connText = document.getElementById("conn-text");
-    const clientIdEl = document.getElementById("client-id");
-    const versionEl = document.getElementById("version");
-
-    function addLog(event, data, isError = false) {
-      const ts = new Date().toLocaleTimeString();
-      const entry = document.createElement("div");
-      entry.className = "entry";
-      entry.innerHTML = `<span class="ts">[${ts}]</span> <span class="${isError ? "error" : "event"}">${event}</span> <span class="data">${data}</span>`;
-      log.appendChild(entry);
-      log.scrollTop = log.scrollHeight;
+    const logEl = document.getElementById("log");
+    const counterEl = document.getElementById("counter");
+    const listEl = document.getElementById("list");
+    const dotEl = document.getElementById("dot");
+    const statusEl = document.getElementById("status-text");
+    const inputEl = document.getElementById("input");
+
+    function log(ev, data) {
+      const t = new Date().toLocaleTimeString("en", { hour12: false });
+      const d = document.createElement("div");
+      d.className = "log-entry";
+      d.innerHTML = `<span class="ts">${t}</span> <span class="ev">${ev}</span> <span class="dt">${data}</span>`;
+      logEl.appendChild(d);
+      logEl.scrollTop = logEl.scrollHeight;
     }
 
-    // --- Create client ---
-    const client = createClient(SERVER_URL, {
-      apiKey: API_KEY,
-      debug: true,
-    });
+    const bs = createClient(location.origin, { apiKey: API_KEY, debug: false });
 
-    clientIdEl.textContent = "connecting...";
+    bs.onStatusChange(s => {
+      dotEl.className = "dot " + s;
+      statusEl.textContent = s;
+      log("status", s);
+    });
 
-    // --- Counter state ---
-    const counter = client.state("counter", 0);
+    bs.onError(e => log("error", e.message));
 
-    counter.subscribe((val) => {
-      document.getElementById("counter-display").textContent = JSON.stringify(val, null, 2);
-      versionEl.textContent = counter.getVersion();
-      addLog("counter:update", `value=${val} version=${counter.getVersion()}`);
+    // Counter
+    const counter = bs.state("counter", 0);
+    counter.subscribe(v => {
+      counterEl.textContent = v;
+      counterEl.classList.add("bump");
+      setTimeout(() => counterEl.classList.remove("bump"), 150);
+      log("counter", `value=${v}`);
     });
 
-    // --- Todos state ---
-    const todos = client.state("todos", []);
+    window.inc = () => counter.update(n => n + 1);
+    window.dec = () => counter.update(n => n - 1);
+    window.resetCounter = () => counter.set(0);
 
-    todos.subscribe((val) => {
-      document.getElementById("todos-display").textContent = JSON.stringify(val, null, 2);
-      addLog("todos:update", `items=${Array.isArray(val) ? val.length : "?"}`);
-    });
+    // Todos
+    const todos = bs.state("todos", []);
 
-    // --- Connection status ---
-    // Poll connection status (simple approach)
-    setInterval(() => {
-      const connected = counter.getVersion() >= 0;
-      if (connText.textContent === "Connecting..." && counter.getVersion() > 0) {
-        connDot.className = "status-dot green";
-        connText.textContent = "Connected";
-        clientIdEl.textContent = client._clientId || "active";
+    function renderTodos(items) {
+      if (!Array.isArray(items) || items.length === 0) {
+        listEl.innerHTML = '<li class="empty">No todos yet</li>';
+        return;
       }
-    }, 500);
-
-    // Mark connected once we get first state
-    setTimeout(() => {
-      connDot.className = "status-dot green";
-      connText.textContent = "Connected";
-    }, 2000);
-
-    // --- Actions (exposed globally for onclick handlers) ---
-    window.increment = () => {
-      counter.update((n) => n + 1);
-      addLog("action", "increment");
-    };
+      listEl.innerHTML = items.map(t => `
+        <li class="todo-item">
+          <div class="todo-check ${t.done ? "done" : ""}" onclick="toggleTodo('${t.id}')"></div>
+          <span class="todo-text ${t.done ? "done" : ""}">${esc(t.text)}</span>
+          <button class="todo-delete" onclick="deleteTodo('${t.id}')">×</button>
+        </li>
+      `).join("");
+    }
 
-    window.decrement = () => {
-      counter.update((n) => n - 1);
-      addLog("action", "decrement");
-    };
+    function esc(s) {
+      const d = document.createElement("div");
+      d.textContent = s;
+      return d.innerHTML;
+    }
 
-    window.resetCounter = () => {
-      counter.update(() => 0);
-      addLog("action", "reset counter");
-    };
+    todos.subscribe(v => {
+      renderTodos(v);
+      log("todos", `count=${Array.isArray(v) ? v.length : 0}`);
+    });
 
     window.addTodo = () => {
-      const input = document.getElementById("todo-input");
-      const text = input.value.trim();
+      const text = inputEl.value.trim();
       if (!text) return;
       const id = crypto.randomUUID();
-      todos.update((list) => [...list, { id, text, done: false }]);
-      addLog("action", `add todo: "${text}"`);
-      input.value = "";
+      const current = todos.get();
+      todos.set([...(Array.isArray(current) ? current : []), { id, text, done: false }]);
+      inputEl.value = "";
+    };
+
+    window.toggleTodo = (id) => {
+      const current = todos.get();
+      if (!Array.isArray(current)) return;
+      todos.set(current.map(t => t.id === id ? { ...t, done: !t.done } : t));
     };
 
-    window.clearTodos = () => {
-      todos.update(() => []);
-      addLog("action", "clear todos");
+    window.deleteTodo = (id) => {
+      const current = todos.get();
+      if (!Array.isArray(current)) return;
+      todos.set(current.filter(t => t.id !== id));
     };
 
-    addLog("init", "SDK loaded, connecting to server...");
+    log("init", "SDK loaded");
   </script>
 </body>
 </html>

package/public/studio.html

@@ -0,0 +1,653 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Better-State Studio</title>
+  <script src="/socket.io/socket.io.js"></script>
+  <style>
+    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+
+    :root {
+      --bg: #06080d;
+      --surface: #0d1117;
+      --border: #1b2230;
+      --border-hl: #2a3548;
+      --text: #e2e8f0;
+      --text-2: #8b98a9;
+      --text-3: #4a5568;
+      --accent: #38bdf8;
+      --green: #34d399;
+      --amber: #fbbf24;
+      --red: #f87171;
+      --violet: #a78bfa;
+      --mono: "JetBrains Mono", "Fira Code", "Cascadia Code", monospace;
+    }
+
+    body {
+      font-family: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;
+      background: var(--bg);
+      color: var(--text);
+      min-height: 100vh;
+    }
+
+    /* Top bar */
+    .topbar {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0.75rem 1.25rem;
+      border-bottom: 1px solid var(--border);
+      background: var(--surface);
+      position: sticky;
+      top: 0;
+      z-index: 10;
+    }
+    .topbar-left {
+      display: flex;
+      align-items: center;
+      gap: 0.75rem;
+    }
+    .logo {
+      font-size: 0.95rem;
+      font-weight: 700;
+      letter-spacing: -0.02em;
+    }
+    .logo span { color: var(--accent); }
+    .badge {
+      font-size: 0.6rem;
+      font-weight: 600;
+      text-transform: uppercase;
+      letter-spacing: 0.06em;
+      background: rgba(56, 189, 248, 0.1);
+      color: var(--accent);
+      padding: 0.15rem 0.5rem;
+      border-radius: 4px;
+    }
+    .topbar-right {
+      display: flex;
+      align-items: center;
+      gap: 1.25rem;
+    }
+    .status-pill {
+      display: flex;
+      align-items: center;
+      gap: 0.35rem;
+      font-size: 0.7rem;
+      color: var(--text-2);
+    }
+    .dot {
+      width: 6px;
+      height: 6px;
+      border-radius: 50%;
+    }
+    .dot.green { background: var(--green); }
+    .dot.amber { background: var(--amber); animation: pulse 1.2s infinite; }
+    .dot.red { background: var(--red); }
+    @keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.3; } }
+
+    /* Stats bar */
+    .stats-bar {
+      display: flex;
+      gap: 0;
+      border-bottom: 1px solid var(--border);
+      background: var(--surface);
+    }
+    .stat {
+      flex: 1;
+      padding: 0.75rem 1.25rem;
+      border-right: 1px solid var(--border);
+    }
+    .stat:last-child { border-right: none; }
+    .stat-label {
+      font-size: 0.6rem;
+      font-weight: 600;
+      text-transform: uppercase;
+      letter-spacing: 0.06em;
+      color: var(--text-3);
+      margin-bottom: 0.2rem;
+    }
+    .stat-value {
+      font-size: 1.25rem;
+      font-weight: 700;
+      font-variant-numeric: tabular-nums;
+    }
+
+    /* Main layout */
+    .main {
+      display: grid;
+      grid-template-columns: 1fr 1fr;
+      height: calc(100vh - 104px);
+    }
+
+    /* Panel */
+    .panel {
+      border-right: 1px solid var(--border);
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+    }
+    .panel:last-child { border-right: none; }
+    .panel-header {
+      padding: 0.6rem 1rem;
+      border-bottom: 1px solid var(--border);
+      font-size: 0.65rem;
+      font-weight: 600;
+      text-transform: uppercase;
+      letter-spacing: 0.06em;
+      color: var(--text-3);
+      background: var(--surface);
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+    .panel-body {
+      flex: 1;
+      overflow-y: auto;
+    }
+
+    /* State list */
+    .state-item {
+      padding: 0.75rem 1rem;
+      border-bottom: 1px solid var(--border);
+      cursor: pointer;
+      transition: background 0.1s;
+    }
+    .state-item:hover { background: rgba(56, 189, 248, 0.03); }
+    .state-item.active { background: rgba(56, 189, 248, 0.06); border-left: 2px solid var(--accent); }
+    .state-key {
+      font-family: var(--mono);
+      font-size: 0.8rem;
+      font-weight: 600;
+      color: var(--accent);
+      margin-bottom: 0.3rem;
+    }
+    .state-meta {
+      display: flex;
+      gap: 1rem;
+      font-size: 0.65rem;
+      color: var(--text-3);
+    }
+    .state-meta code {
+      font-family: var(--mono);
+      color: var(--text-2);
+    }
+    .state-preview {
+      margin-top: 0.4rem;
+      font-family: var(--mono);
+      font-size: 0.7rem;
+      color: var(--text-2);
+      background: rgba(0,0,0,0.3);
+      padding: 0.4rem 0.5rem;
+      border-radius: 6px;
+      max-height: 80px;
+      overflow: hidden;
+      white-space: pre-wrap;
+      word-break: break-all;
+    }
+
+    /* Detail / right panel */
+    .detail-empty {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 100%;
+      color: var(--text-3);
+      font-size: 0.8rem;
+    }
+    .detail-header {
+      padding: 1rem;
+      border-bottom: 1px solid var(--border);
+      background: var(--surface);
+    }
+    .detail-key {
+      font-family: var(--mono);
+      font-size: 1rem;
+      font-weight: 700;
+      color: var(--accent);
+      margin-bottom: 0.3rem;
+    }
+    .detail-info {
+      display: flex;
+      gap: 1.5rem;
+      font-size: 0.7rem;
+      color: var(--text-3);
+    }
+    .detail-info strong { color: var(--text-2); }
+    .detail-value {
+      padding: 1rem;
+      border-bottom: 1px solid var(--border);
+    }
+    .detail-value-label {
+      font-size: 0.6rem;
+      font-weight: 600;
+      text-transform: uppercase;
+      letter-spacing: 0.06em;
+      color: var(--text-3);
+      margin-bottom: 0.5rem;
+    }
+    .detail-value pre {
+      font-family: var(--mono);
+      font-size: 0.75rem;
+      color: var(--green);
+      background: rgba(0,0,0,0.4);
+      padding: 0.75rem;
+      border-radius: 8px;
+      max-height: 240px;
+      overflow-y: auto;
+      white-space: pre-wrap;
+      word-break: break-all;
+    }
+
+    /* Event feed */
+    .event-row {
+      padding: 0.4rem 1rem;
+      border-bottom: 1px solid var(--border);
+      font-size: 0.7rem;
+      display: flex;
+      gap: 0.6rem;
+      align-items: baseline;
+      transition: background 0.3s;
+    }
+    .event-row.flash { background: rgba(52, 211, 153, 0.06); }
+    .event-ts {
+      font-family: var(--mono);
+      color: var(--text-3);
+      font-size: 0.65rem;
+      flex-shrink: 0;
+      width: 65px;
+    }
+    .event-key {
+      font-family: var(--mono);
+      color: var(--accent);
+      font-weight: 600;
+      flex-shrink: 0;
+      max-width: 120px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+    .event-type {
+      font-family: var(--mono);
+      font-size: 0.6rem;
+      padding: 0.1rem 0.35rem;
+      border-radius: 3px;
+      flex-shrink: 0;
+    }
+    .event-type.set { background: rgba(167, 139, 250, 0.15); color: var(--violet); }
+    .event-type.fn { background: rgba(56, 189, 248, 0.15); color: var(--accent); }
+    .event-detail {
+      color: var(--text-3);
+      font-family: var(--mono);
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+    .event-client {
+      color: var(--text-3);
+      font-family: var(--mono);
+      font-size: 0.6rem;
+      margin-left: auto;
+      flex-shrink: 0;
+    }
+
+    .empty-msg {
+      padding: 2rem;
+      text-align: center;
+      color: var(--text-3);
+      font-size: 0.8rem;
+    }
+
+    .refresh-btn {
+      background: none;
+      border: 1px solid var(--border);
+      color: var(--text-2);
+      font-size: 0.6rem;
+      padding: 0.2rem 0.5rem;
+      border-radius: 4px;
+      cursor: pointer;
+      font-weight: 600;
+      text-transform: uppercase;
+      letter-spacing: 0.04em;
+    }
+    .refresh-btn:hover { border-color: var(--border-hl); color: var(--text); }
+
+    @media (max-width: 768px) {
+      .main { grid-template-columns: 1fr; }
+      .stats-bar { flex-wrap: wrap; }
+      .stat { min-width: 50%; }
+    }
+  </style>
+</head>
+<body>
+
+  <!-- Top bar -->
+  <div class="topbar">
+    <div class="topbar-left">
+      <div class="logo"><span>Better</span>-State</div>
+      <span class="badge">Studio</span>
+    </div>
+    <div class="topbar-right">
+      <div class="status-pill">
+        <div id="dot" class="dot amber"></div>
+        <span id="status">connecting</span>
+      </div>
+    </div>
+  </div>
+
+  <!-- Stats -->
+  <div class="stats-bar">
+    <div class="stat">
+      <div class="stat-label">State Keys</div>
+      <div class="stat-value" id="stat-states">—</div>
+    </div>
+    <div class="stat">
+      <div class="stat-label">Total Events</div>
+      <div class="stat-value" id="stat-events">—</div>
+    </div>
+    <div class="stat">
+      <div class="stat-label">Connections</div>
+      <div class="stat-value" id="stat-conns">—</div>
+    </div>
+    <div class="stat">
+      <div class="stat-label">Uptime</div>
+      <div class="stat-value" id="stat-uptime">—</div>
+    </div>
+  </div>
+
+  <!-- Main -->
+  <div class="main">
+    <!-- Left: state list -->
+    <div class="panel">
+      <div class="panel-header">
+        <span>State Explorer</span>
+        <button class="refresh-btn" onclick="loadStates()">Refresh</button>
+      </div>
+      <div class="panel-body" id="state-list">
+        <div class="empty-msg">Loading states...</div>
+      </div>
+    </div>
+
+    <!-- Right: detail + live feed -->
+    <div class="panel">
+      <div class="panel-header">
+        <span id="right-title">Live Event Feed</span>
+      </div>
+      <div class="panel-body" id="right-panel">
+        <div id="detail-view" style="display:none"></div>
+        <div id="feed"></div>
+      </div>
+    </div>
+  </div>
+
+  <script type="module">
+    const API_KEY = "__API_KEY__";
+    const BASE = window.location.origin;
+
+    const stateListEl = document.getElementById("state-list");
+    const rightTitle = document.getElementById("right-title");
+    const detailView = document.getElementById("detail-view");
+    const feedEl = document.getElementById("feed");
+    const dotEl = document.getElementById("dot");
+    const statusEl = document.getElementById("status");
+
+    let allStates = [];
+    let selectedKey = null;
+
+    // --- Stats ---
+    async function loadStats() {
+      try {
+        const res = await fetch(`${BASE}/api/v1/studio/stats`);
+        const d = await res.json();
+        document.getElementById("stat-states").textContent = d.states;
+        document.getElementById("stat-events").textContent = d.events.toLocaleString();
+        document.getElementById("stat-conns").textContent = d.connections;
+        const m = Math.floor(d.uptime / 60);
+        const s = Math.floor(d.uptime % 60);
+        document.getElementById("stat-uptime").textContent = m > 0 ? `${m}m ${s}s` : `${s}s`;
+      } catch {}
+    }
+
+    // --- States ---
+    async function loadStates() {
+      try {
+        const res = await fetch(`${BASE}/api/v1/studio/states`);
+        allStates = await res.json();
+        renderStateList();
+      } catch {
+        stateListEl.innerHTML = '<div class="empty-msg">Failed to load states</div>';
+      }
+    }
+
+    function renderStateList() {
+      if (allStates.length === 0) {
+        stateListEl.innerHTML = '<div class="empty-msg">No state keys yet. Use the SDK to create some.</div>';
+        return;
+      }
+
+      stateListEl.innerHTML = allStates.map(s => {
+        const val = tryParse(s.snapshot);
+        const preview = JSON.stringify(val, null, 2);
+        const shortPreview = preview.length > 120 ? preview.slice(0, 120) + "…" : preview;
+        const age = timeAgo(s.updated_at);
+        const active = s.key === selectedKey ? "active" : "";
+
+        return `
+          <div class="state-item ${active}" onclick="selectState('${s.key}')">
+            <div class="state-key">${esc(s.key)}</div>
+            <div class="state-meta">
+              <span>v<code>${s.version}</code></span>
+              <span>updated <code>${age}</code></span>
+              <span><code>${s.namespace_name}</code></span>
+            </div>
+            <div class="state-preview">${esc(shortPreview)}</div>
+          </div>
+        `;
+      }).join("");
+    }
+
+    window.selectState = async function(key) {
+      selectedKey = key;
+      renderStateList();
+
+      const s = allStates.find(x => x.key === key);
+      if (!s) return;
+
+      rightTitle.textContent = `State: ${key}`;
+      detailView.style.display = "block";
+
+      const val = tryParse(s.snapshot);
+      const pretty = JSON.stringify(val, null, 2);
+
+      let historyHtml = '<div class="empty-msg">Loading history...</div>';
+
+      detailView.innerHTML = `
+        <div class="detail-header">
+          <div class="detail-key">${esc(key)}</div>
+          <div class="detail-info">
+            <span>Version: <strong>${s.version}</strong></span>
+            <span>Namespace: <strong>${esc(s.namespace_name)}</strong></span>
+            <span>Updated: <strong>${timeAgo(s.updated_at)}</strong></span>
+          </div>
+        </div>
+        <div class="detail-value">
+          <div class="detail-value-label">Current Value</div>
+          <pre id="detail-json">${esc(pretty)}</pre>
+        </div>
+        <div style="padding:0.6rem 1rem;border-bottom:1px solid var(--border)">
+          <div class="detail-value-label" style="margin-bottom:0">Recent Mutations</div>
+        </div>
+        <div id="detail-history">${historyHtml}</div>
+      `;
+
+      try {
+        const nsId = s.namespace;
+        const res = await fetch(`${BASE}/api/v1/states/${encodeURIComponent(key)}/history?namespace=${nsId}&limit=20`);
+        const data = await res.json();
+        const histEl = document.getElementById("detail-history");
+        if (data.events.length === 0) {
+          histEl.innerHTML = '<div class="empty-msg">No mutations yet</div>';
+        } else {
+          histEl.innerHTML = data.events.map(e => renderEventRow(e, key)).join("");
+        }
+      } catch {
+        document.getElementById("detail-history").innerHTML = '<div class="empty-msg">Failed to load history</div>';
+      }
+    };
+
+    // --- Live feed ---
+    async function loadRecentEvents() {
+      try {
+        const res = await fetch(`${BASE}/api/v1/studio/events/recent?limit=50`);
+        const events = await res.json();
+        if (events.length === 0) {
+          feedEl.innerHTML = '<div class="empty-msg">No events yet. Mutations will appear here in real-time.</div>';
+        } else {
+          feedEl.innerHTML = events.map(e => renderEventRow(e, e.state_key)).join("");
+          feedEl.scrollTop = feedEl.scrollHeight;
+        }
+      } catch {}
+    }
+
+    function renderEventRow(e, key) {
+      const ts = new Date(e.server_ts || e.client_ts).toLocaleTimeString("en", { hour12: false });
+      const isSet = e.mutation === "__SET__";
+      const typeClass = isSet ? "set" : "fn";
+      const typeLabel = isSet ? "SET" : "FN";
+
+      let detail = "";
+      if (isSet && e.meta) {
+        const meta = tryParse(e.meta);
+        if (meta && meta.fallbackValue !== undefined) {
+          detail = JSON.stringify(meta.fallbackValue);
+          if (detail.length > 60) detail = detail.slice(0, 60) + "…";
+        }
+      } else if (!isSet) {
+        detail = e.mutation;
+        if (detail.length > 60) detail = detail.slice(0, 60) + "…";
+      }
+
+      const clientShort = (e.client_id || "").slice(0, 8);
+
+      return `
+        <div class="event-row">
+          <span class="event-ts">${ts}</span>
+          <span class="event-key">${esc(key)}</span>
+          <span class="event-type ${typeClass}">${typeLabel}</span>
+          <span class="event-detail">${esc(detail)}</span>
+          <span class="event-client">${clientShort}</span>
+        </div>
+      `;
+    }
+
+    function addLiveEvent(data) {
+      if (!feedEl) return;
+
+      const ts = new Date(data.timestamp).toLocaleTimeString("en", { hour12: false });
+      const val = JSON.stringify(data.value);
+      const short = val.length > 60 ? val.slice(0, 60) + "…" : val;
+      const clientShort = (data.clientId || "").slice(0, 8);
+
+      const row = document.createElement("div");
+      row.className = "event-row flash";
+      row.innerHTML = `
+        <span class="event-ts">${ts}</span>
+        <span class="event-key">${esc(data.key)}</span>
+        <span class="event-type set">UPD</span>
+        <span class="event-detail">→ ${esc(short)}</span>
+        <span class="event-client">${clientShort}</span>
+      `;
+      feedEl.appendChild(row);
+      feedEl.scrollTop = feedEl.scrollHeight;
+      setTimeout(() => row.classList.remove("flash"), 1500);
+
+      // Update stats
+      loadStats();
+
+      // Update the state in our local list
+      const existing = allStates.find(s => s.key === data.key);
+      if (existing) {
+        existing.snapshot = JSON.stringify(data.value);
+        existing.version = data.version;
+        existing.updated_at = data.timestamp;
+        renderStateList();
+
+        // Update detail view if this key is selected
+        if (selectedKey === data.key) {
+          const jsonEl = document.getElementById("detail-json");
+          if (jsonEl) jsonEl.textContent = JSON.stringify(data.value, null, 2);
+        }
+      } else {
+        // New state key — reload
+        loadStates();
+      }
+    }
+
+    // --- WebSocket for live updates ---
+    function connectWs() {
+      if (typeof window.io === "undefined") {
+        console.warn("socket.io client not loaded");
+        dotEl.className = "dot red";
+        statusEl.textContent = "ws unavailable";
+        return;
+      }
+      const socket = window.io(BASE, { transports: ["websocket"] });
+
+      socket.on("connect", () => {
+        dotEl.className = "dot amber";
+        statusEl.textContent = "authenticating";
+        socket.emit("auth", { apiKey: API_KEY, clientId: "studio-" + Math.random().toString(36).slice(2, 8) }, (res) => {
+          if (res && res.ok) {
+            dotEl.className = "dot green";
+            statusEl.textContent = "connected";
+            socket.emit("subscribe:studio");
+          } else {
+            dotEl.className = "dot red";
+            statusEl.textContent = "auth failed";
+          }
+        });
+      });
+
+      socket.on("auth:ok", () => {
+        dotEl.className = "dot green";
+        statusEl.textContent = "connected";
+      });
+
+      socket.on("studio:mutation", (data) => {
+        addLiveEvent(data);
+      });
+
+      socket.on("disconnect", () => {
+        dotEl.className = "dot red";
+        statusEl.textContent = "disconnected";
+      });
+    }
+
+    // --- Helpers ---
+    function tryParse(s) {
+      try { return JSON.parse(s); } catch { return s; }
+    }
+
+    function esc(s) {
+      const d = document.createElement("div");
+      d.textContent = String(s);
+      return d.innerHTML;
+    }
+
+    function timeAgo(ts) {
+      const diff = Date.now() - ts;
+      if (diff < 60000) return "just now";
+      if (diff < 3600000) return Math.floor(diff / 60000) + "m ago";
+      if (diff < 86400000) return Math.floor(diff / 3600000) + "h ago";
+      return Math.floor(diff / 86400000) + "d ago";
+    }
+
+    // --- Init ---
+    loadStats();
+    loadStates();
+    loadRecentEvents();
+    setInterval(loadStats, 10000);
+    connectWs();
+  </script>
+</body>
+</html>