@njeybe/nativ 2.7.0 → 2.9.0

package/dist/server/studio-ui/pages/benchmarks/script.js

@@ -34,9 +34,9 @@ export const benchmarksScript = String.raw `  // ─── View 4: Synthetic ben
     if (env.cpuCount) meta.push(env.cpuCount + ' CPUs');
     var score = clampPct(s.score);
     return '<section class="card hero' + (running ? ' is-running' : '') + '" aria-labelledby="hero-h" aria-busy="' + running + '">' +
-      '<div><h2 class="eyebrow" id="hero-h">Average throughput</h2>' +
+      '<div><h2 class="hero-title" id="hero-h">Average throughput</h2>' +
       '<div class="hero-value">' + num(Math.round(s.averageThroughputOpsPerSec || 0)) + '<span class="badge badge-accent">ops/sec</span></div>' +
-      '<p class="hero-meta">' + meta.join(' · ') + '</p></div>' +
+      '<p class="hero-meta">' + meta.join(', ') + '</p></div>' +
       '<dl class="hero-stats">' +
         '<div><dt>Score</dt><dd class="' + (score < 100 ? 'text-danger' : '') + '">' + score + '%</dd></div>' +
         '<div><dt>Scenarios passed</dt><dd>' + num(s.passedScenarios) + '/' + num(s.totalScenarios) + '</dd></div>' +
@@ -48,16 +48,17 @@ export const benchmarksScript = String.raw `  // ─── View 4: Synthetic ben
   function scenarioCards(r) {
     var byId = {}, known = {};
     (r.scenarios || []).forEach(function (s) { byId[s.id] = s; });
-    var cards = SCENARIOS.map(function (meta) { known[meta.id] = true; return scenarioCard(meta.label, byId[meta.id]); });
+    var cards = [], idle = [];
+    SCENARIOS.forEach(function (meta) {
+      known[meta.id] = true;
+      if (byId[meta.id]) cards.push(scenarioCard(meta.label, byId[meta.id])); else idle.push(meta.label);
+    });
     (r.scenarios || []).forEach(function (s) { if (!known[s.id]) cards.push(scenarioCard(s.name || s.id, s)); });
+    if (idle.length) cards.push('<p class="muted not-run">Not run: ' + idle.map(esc).join(', ') + '.</p>');
     return cards.join('');
   }
 
   function scenarioCard(label, s) {
-    if (!s) {
-      return '<article class="card scenario is-idle"><header class="scenario-head"><h3>' + esc(label) + '</h3><span class="badge badge-neutral">Not run</span></header>' +
-        '<p class="muted">Not part of the last run. Run the full matrix to score it.</p></article>';
-    }
     var total = (s.assertionsPassed || 0) + (s.assertionsFailed || 0);
     var passed = s.status === 'passed';
     var score = total ? Math.round((s.assertionsPassed || 0) / total * 100) : (passed ? 100 : 0);
@@ -76,7 +77,7 @@ export const benchmarksScript = String.raw `  // ─── View 4: Synthetic ben
       '<div class="metrics"><div><span class="metric-v">' + score + '%</span><span class="metric-l">Score</span></div>' +
       '<div><span class="metric-v">' + fmtMs(s.durationMs) + '</span><span class="metric-l">Latency</span></div>' +
       '<div><span class="metric-v">' + num(Math.round(s.throughputOpsPerSec || 0)) + '</span><span class="metric-l">ops/sec</span></div></div>' +
-      progressBar(score, 'sc-' + s.id, label + ' score', passed ? 'success' : 'danger') +
+      progressBar(score, 'sc-' + s.id, label + ' score', passed ? '' : 'danger') +
       (details ? '<dl class="details">' + details + '</dl>' : '') + errors + '</article>';
   }
 

package/dist/server/studio-ui/pages/benchmarks/styles.js

@@ -2,7 +2,9 @@
 export const benchmarksCss = String.raw `/* Benchmarks */
 .hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 20px 32px; padding: 22px 0; margin-bottom: 0; background: none; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; transition: opacity .2s; }
 .hero.is-running { opacity: .6; }
-.eyebrow { margin: 0; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
+.hero-title { margin: 0; font-size: 14px; font-weight: 600; color: var(--muted); }
+.not-run { margin: 0; padding: 12px 0; font-size: 13px; }
+.scenario .progress { height: 4px; }
 .hero-value { display: flex; align-items: center; gap: 10px; margin: 6px 0; font-size: 40px; font-weight: 650; letter-spacing: -0.03em; line-height: 1.1; font-variant-numeric: tabular-nums; }
 .hero-value .badge { font-size: 12px; letter-spacing: 0; }
 .hero-meta { margin: 0; font-size: 13.5px; color: var(--muted); }

package/dist/server/studio-ui/pages/database/browser.js

@@ -168,7 +168,7 @@ export const databaseBrowserScript = String.raw `  // ─── Database Studio:
     table.columns.forEach(function (col) {
       var isPk = col.primaryKey;
       var fieldLabel = esc(col.name) + (isPk ? ' (Primary Key - Optional/Auto)' : '');
-      var placeholder = col.type + (col.default ? ' · default: ' + col.default : '');
+      var placeholder = col.type + (col.default ? ', default: ' + col.default : '');
       var isLong = /json|map|array|text/i.test(col.type);
       if (isLong) {
         html += '<div class="field field-full"><label><b>' + fieldLabel + '</b></label><textarea class="input" name="' + esc(col.name) + '" placeholder="' + esc(placeholder) + '"></textarea></div>';

package/dist/server/studio-ui/pages/database/connection.js

@@ -3,10 +3,11 @@ export const databaseConnectionScript = String.raw `  // ─── Database Stud
   function renderModalStatus() {
     ['dev', 'prod'].forEach(function (env) {
       var s = state.status && state.status[env];
-      $('mdot-' + env).className = 'dot ' + (s && s.connected ? 'on' : 'off');
+      var unset = !s || /No (Dev|Prod) database configured/.test(s.error || '');
+      $('mdot-' + env).className = 'dot ' + (s && s.connected ? 'on' : unset ? '' : 'off');
       $('current-' + env).innerHTML = s && s.maskedUrl
         ? 'Current: <code>' + esc(s.maskedUrl) + '</code><span class="copy-wrap"><span class="tooltip">Copied!</span><button class="btn small" type="button" data-copy-masked="' + env + '">Copy</button></span>'
-        : 'Current: <span class="muted">not configured</span>';
+        : 'Current: <span class="muted">Not set up</span>';
     });
   }
 
@@ -139,8 +140,8 @@ export const databaseConnectionScript = String.raw `  // ─── Database Stud
       if (r.success) {
         var count = r.entityCount != null ? r.entityCount : r.tableCount;
         out.className = 'result ok';
-        out.textContent = 'Connected to ' + (ENGINE_LABEL[r.engine] || r.engine) + ' in ' + Math.round(r.pingMs) + 'ms · ' + count + ' ' +
-          entityNoun({ engine: r.engine }, true).toLowerCase() + ' · saved to session as ' + r.maskedUrl;
+        out.textContent = 'Connected to ' + (ENGINE_LABEL[r.engine] || r.engine) + ' in ' + Math.round(r.pingMs) + 'ms, ' + count + ' ' +
+          entityNoun({ engine: r.engine }, true).toLowerCase() + ', saved to session as ' + r.maskedUrl;
         $('url-' + env).value = '';
         $('ppass-' + env).value = '';
         return true;

package/dist/server/studio-ui/pages/database/data-shell.js

@@ -53,9 +53,12 @@ export const databaseDataScript = String.raw `  // ─── View 5: Database St
     var label = env.toUpperCase();
     if (!s) return '<span class="pill"><span class="dot"></span><b>' + label + ':</b> loading…</span>';
     if (!s.connected) {
-      var why = /No (Dev|Prod) database configured/.test(s.error || '') ? 'not configured' : 'offline';
-      return '<span class="pill" title="' + esc(s.error || '') + '"><span class="dot off"></span><b>' + label + ':</b> ' + why +
-        ' <span class="badge badge-offline">OFFLINE</span></span>';
+      if (/No (Dev|Prod) database configured/.test(s.error || '')) {
+        return '<span class="pill"><span class="dot"></span><b>' + label + ':</b> ' +
+          '<span class="badge badge-neutral">Not set up</span></span>';
+      }
+      return '<span class="pill" title="' + esc(s.error || '') + '"><span class="dot off"></span><b>' + label + ':</b> offline' +
+        ' <span class="badge badge-offline">Offline</span></span>';
     }
     var sourceBadge = s.synthesized && s.sourceKey
       ? ' <span class="badge badge-synth" title="Assembled in memory from fragmented .env keys">synthesized from ' + esc(keyFamily(s.sourceKey)) + '</span>'
@@ -63,7 +66,7 @@ export const databaseDataScript = String.raw `  // ─── View 5: Database St
         ? ' <span class="badge badge-source" title="Detected in ' + esc(s.exampleFile || '.env.example') + '">via ' + esc(s.sourceKey) + '</span>'
         : (s.sourceKey ? ' <span class="badge badge-source">via ' + esc(s.sourceKey) + '</span>' : '');
     return '<span class="pill" title="' + esc(s.maskedUrl) + '"><span class="dot on"></span><b>' + label + ':</b> ' +
-      esc(ENGINE_LABEL[s.engine] || s.engine) + (s.database ? ' · ' + esc(s.database) : '') + ' (' + Math.round(s.pingMs) + 'ms): ' +
+      esc(ENGINE_LABEL[s.engine] || s.engine) + (s.database ? ', ' + esc(s.database) : '') + ' (' + Math.round(s.pingMs) + 'ms): ' +
       entityCount(s) + ' ' + entityNoun(s, true) + sourceBadge + ' <span class="badge badge-online">ONLINE</span></span>';
   }
 
@@ -97,15 +100,8 @@ export const databaseDataScript = String.raw `  // ─── View 5: Database St
             '<span class="diagnostic-tag">[DIAGNOSTIC]</span> ' +
             '<span class="diagnostic-msg">' + esc(suggestion) + '</span>' +
           '</div>' +
-          '<div class="diagnostic-actions">' +
-            '<button class="btn small" type="button" id="btn-diag-settings">Open Connection Settings</button>' +
-          '</div>' +
         '</div>';
         bannerEl.hidden = false;
-        var btnDiag = $('btn-diag-settings');
-        if (btnDiag) {
-          btnDiag.onclick = function () { openSettings(); };
-        }
       } else {
         bannerEl.innerHTML = '';
         bannerEl.hidden = true;
@@ -158,8 +154,7 @@ export const databaseDataScript = String.raw `  // ─── View 5: Database St
     '<path d="M128,24C74.17,24,32,48.6,32,80v96c0,31.4,42.17,56,96,56s96-24.6,96-56V80C224,48.6,181.83,24,128,24Zm80,104c0,9.62-7.88,19.43-21.61,26.92C170.93,163.35,150.19,168,128,168s-42.93-4.65-58.39-13.08C55.88,147.43,48,137.62,48,128V111.36c17.06,15,46.23,24.64,80,24.64s62.94-9.68,80-24.64ZM69.61,53.08C85.07,44.65,105.81,40,128,40s42.93,4.65,58.39,13.08C200.12,60.57,208,70.38,208,80s-7.88,19.43-21.61,26.92C170.93,115.35,150.19,120,128,120s-42.93-4.65-58.39-13.08C55.88,99.43,48,89.62,48,80S55.88,60.57,69.61,53.08ZM186.39,202.92C170.93,211.35,150.19,216,128,216s-42.93-4.65-58.39-13.08C55.88,195.43,48,185.62,48,176V159.36c17.06,15,46.23,24.64,80,24.64s62.94-9.68,80-24.64V176C208,185.62,200.12,195.43,186.39,202.92Z"/></svg>';
 
   function emptyState(title, text) {
-    return '<div class="empty card">' + DB_ICON + '<h3>' + esc(title) + '</h3><p>' + esc(text) + '</p>' +
-      '<button class="btn primary" type="button" data-action="open-settings">Connection Settings</button></div>';
+    return '<div class="empty card">' + DB_ICON + '<h3>' + esc(title) + '</h3><p>' + esc(text) + '</p></div>';
   }
 
 `;

package/dist/server/studio-ui/pages/database/drift.js

@@ -292,7 +292,7 @@ export const databaseDriftScript = String.raw `  // ─── Database Studio: d
     var lang = state.scriptLang;
     var unit = lang === 'json' ? ' change(s)' : ' statement(s)';
     return '<div class="sql-wrap card"><div class="sql-head"><span class="muted"><span class="lang">' + LANG_LABEL[lang] + '</span>' +
-      (destructive ? '<span class="badge badge-dropped">DESTRUCTIVE</span> ' : '') + state.scriptCount + unit + ' · read-only preview</span>' +
+      (destructive ? '<span class="badge badge-dropped">DESTRUCTIVE</span> ' : '') + state.scriptCount + unit + ', read-only preview</span>' +
       '<span class="copy-wrap"><span class="tooltip">Copied!</span><button class="btn small" type="button" data-action="copy-sql">Copy ' +
       (lang === 'sql' ? 'SQL' : lang === 'js' ? 'Script' : 'JSON') + '</button></span></div>' +
       '<pre class="sql" tabindex="0" aria-label="Migration script (' + LANG_LABEL[lang] + ')"><code>' + highlightScript(state.sql, lang) + '</code></pre></div>';

package/dist/server/studio-ui/pages/database/events.js

@@ -123,8 +123,7 @@ export const databaseEventsScript = String.raw `  // ─── Events: Database
       return;
     }
     var action = el.getAttribute('data-action');
-    if (action === 'open-settings') openSettings();
-    else if (action === 'copy-sql') copyText(state.sql, el);
+    if (action === 'copy-sql') copyText(state.sql, el);
     else if (action === 'edit-record') openEditRecordModal(Number(el.getAttribute('data-row')));
     else if (action === 'delete-record') handleDeleteRecord(Number(el.getAttribute('data-row')));
     else if (action === 'preview-url') {

package/dist/server/studio-ui/pages/database/explorer.js

@@ -45,7 +45,7 @@ export const databaseExplorerScript = String.raw `  // ─── Database Studio
       : '';
     var docMeta = coll && (t.documentCount != null || t.sampledDocuments != null)
       ? '<p class="desc">' + (t.documentCount != null ? '~' + t.documentCount + ' documents' : 'Document count unavailable') +
-        (t.sampledDocuments != null ? ' · fields inferred from ' + t.sampledDocuments + ' sampled' : '') + '</p>'
+        (t.sampledDocuments != null ? ', fields inferred from ' + t.sampledDocuments + ' sampled' : '') + '</p>'
       : '';
     return '<details class="table-card"><summary><span class="tname">' + esc(t.name) + '</span>' +
       (coll ? '<span class="badge badge-collection">COLLECTION</span>' : '') +
@@ -87,7 +87,7 @@ export const databaseExplorerScript = String.raw `  // ─── Database Studio
     var parts = [m.mimeType || 'unknown type'];
     if (m.width && m.height) parts.push(m.width + '×' + m.height);
     if (m.sizeBytes != null) parts.push(formatBytes(m.sizeBytes));
-    return parts.join(' · ');
+    return parts.join(', ');
   }
 
   function showThumb(el) {
@@ -117,7 +117,7 @@ export const databaseExplorerScript = String.raw `  // ─── Database Studio
     hideThumb();
     var m = entry.media;
     $('media-title').textContent = entry.table + '.' + entry.field;
-    $('media-sub').textContent = (m ? SOURCE_LABEL[m.source] || m.source : 'Image field') + ' · ' + entry.type;
+    $('media-sub').textContent = (m ? SOURCE_LABEL[m.source] || m.source : 'Image field') + ', ' + entry.type;
     $('media-thumb').innerHTML = thumbHtml(m);
     var rows = [];
     if (m) {
@@ -144,7 +144,7 @@ export const databaseExplorerScript = String.raw `  // ─── Database Studio
     var body;
     if (!s || !s.connected) {
       body = '<div class="empty" style="padding:28px 12px"><p>' + esc(s && s.error ? s.error : 'No database connected.') + '</p>' +
-        '<button class="btn small" type="button" data-action="open-settings">Connect</button></div>';
+        '<p class="muted">Use Connection Settings at the top.</p></div>';
     } else if (!tables.length) {
       body = '<p class="muted">Connected, but this database has no ' + entityNoun(s, true).toLowerCase() + ' yet.</p>';
     } else if (!filtered.length) {

package/dist/server/studio-ui/pages/flow/layout.js

@@ -1,5 +1,5 @@
 // Plan layout: rounds, lanes, links and the highlight set. Pure, no DOM.
-export const flowLayoutScript = String.raw `  var FLOW = { W: 206, H: 58, GX: 52, GY: 10, PAD: 14, LX: 128, TOP: 30 };
+export const flowLayoutScript = String.raw `  var FLOW = { W: 206, H: 74, GX: 52, GY: 10, PAD: 14, LX: 128, TOP: 30 };
 
   function flowAgentKey(t) { return t.agent || 'unassigned'; }
 

package/dist/server/studio-ui/pages/flow/styles.js

@@ -25,7 +25,7 @@ export const flowCss = String.raw `#panel-flow .seg { display: inline-flex; bord
 #panel-flow .node .l1 { display: flex; align-items: center; gap: 6px; }
 #panel-flow .node .l1 .d { margin-left: auto; font: 11px var(--mono); color: var(--fg-3); }
 #panel-flow .node .l1 .mono { font-size: 11px; }
-#panel-flow .node .title { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+#panel-flow .node .title { font-size: 12.5px; line-height: 1.3; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
 #panel-flow .canvas.focus .node:not(.hot) { opacity: .3; }
 #panel-flow .node.sel { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
 #panel-flow .legend { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--fg-2); align-items: center; }

package/dist/server/studio-ui/pages/flow/timeline-view.js

@@ -51,7 +51,7 @@ export const flowTimelineScript = String.raw `  function flowStat(k, v, s) {
     var cw = t.checkMs && t.status === 'completed' ? Math.min(w, t.checkMs * tm.sg.k) : 0;
     var lx = w > 64 ? x1 + 6 : x2 + 4;
     var took = (t.status === 'in_progress' ? 'running' : 'took ' + fmt.dur(t.durationMs)) + (t.checkMs ? ', check ' + fmt.dur(t.checkMs) : '');
-    var tip = ui.esc(t.id + ' · ' + t.title) + '
' + ui.esc(took);
+    var tip = ui.esc(t.id + ', ' + t.title) + '
' + ui.esc(took);
     return '<g><rect class="bar-w ' + ui.esc(t.status) + '" data-task="' + ui.esc(t.id) + '" data-row="' + row + '" x="' + x1 + '" y="' + by +
       '" width="' + w + '" height="21" rx="4"><title>' + tip + '</title></rect>' +
       (cw > 1 ? '<rect class="bar-c" x="' + (x2 - cw) + '" y="' + (by + 17) + '" width="' + cw + '" height="4" rx="1"/>' : '') +

package/dist/server/studio-ui/pages/home/script.js

@@ -24,7 +24,7 @@ export const homeScript = String.raw `  var esc = Studio.ui.esc;
     var t = item.task;
     if (t.status === 'blocked') return t.reason || 'Paused after 3 attempts.';
     var e = item.escalation || {};
-    return e.reason || e.summary || e.details || 'Waiting for your decision.';
+    return e.reason || e.summary || e.details || 'Needs your decision.';
   }
 
   function needActions(item) {
@@ -55,16 +55,8 @@ export const homeScript = String.raw `  var esc = Studio.ui.esc;
       rightText(count) + '</div>' + n.map(needItem).join('') + '</section>';
   }
 
-  function isReady(model, t) {
-    if (t.status !== 'pending') return false;
-    return t.isAvailable || t.deps.every(function (d) {
-      var dep = model.byId[d];
-      return !dep || dep.status === 'completed';
-    });
-  }
-
   function readyTasks(model) {
-    return model.tasks.filter(function (t) { return isReady(model, t); });
+    return model.tasks.filter(Studio.status.isReady);
   }
 
   function dispatchBtn(id, label, cls) {
@@ -75,17 +67,18 @@ export const homeScript = String.raw `  var esc = Studio.ui.esc;
   function taskCells(t) {
     return '<span class="mono id">' + esc(t.id) + '</span>' +
       '<button type="button" class="t link" data-task="' + esc(t.id) + '">' + esc(t.title) + '</button>' +
-      '<span class="agent">' + esc(t.agent || '') + '</span>';
+      '<span class="agent">' + esc(Studio.agentInfo(t.agent).label) + '</span>';
   }
 
   function runRow(t) {
     var since = t.startT ? ' data-since="' + t.startT + '">' + Studio.fmt.dur(Studio.now() - t.startT) : '>';
     var row = '<div class="row run-row">' + taskCells(t) +
-      '<span class="state"><i class="dot run"></i>Running</span>' +
+      '<span class="state">Running</span>' +
       '<span class="mono num timer"' + since + '</span></div>';
     var log = '<span class="mono log">' + esc(t.latestLog || '') + '</span>';
-    return row + '<div class="row sub-row">' + log + '<button type="button" class="btn" data-act="home-console"' +
-      ' data-id="' + esc(t.id) + '">Open console</button></div>';
+    var watch = t.run ? '<button type="button" class="btn" data-act="home-console" data-id="' +
+      esc(t.id) + '">Watch live</button>' : '';
+    return row + '<div class="row sub-row">' + log + watch + '</div>';
   }
 
   function nowRunning(model) {
@@ -96,23 +89,18 @@ export const homeScript = String.raw `  var esc = Studio.ui.esc;
     return section('running', 'Now running', '', '<div class="row calm"><span>No agent is running.</span>' + btn + '</div>');
   }
 
-  function waitOn(model, t) {
-    var open = t.deps.filter(function (d) { var x = model.byId[d]; return x && x.status !== 'completed'; });
-    return open[0] || '';
-  }
-
-  function nextRow(model, t) {
-    var end = isReady(model, t) ? dispatchBtn(t.id, 'Dispatch') :
-      '<span class="wait">waits <span class="mono">' + esc(waitOn(model, t)) + '</span></span>';
+  function nextRow(t) {
+    var end = Studio.status.isReady(t) ? dispatchBtn(t.id, 'Dispatch') :
+      '<span class="wait">' + esc(Studio.status.waitText(t)) + '</span>';
     return '<div class="row next-row">' + taskCells(t) + end + '</div>';
   }
 
   function upNext(model) {
     var list = model.tasks.filter(function (t) { return t.status === 'pending'; });
-    var ready = list.filter(function (t) { return isReady(model, t); });
-    var waiting = list.filter(function (t) { return !isReady(model, t); });
+    var ready = list.filter(Studio.status.isReady);
+    var waiting = list.filter(function (t) { return !Studio.status.isReady(t); });
     var rows = ready.concat(waiting).slice(0, UP_NEXT_CAP);
-    var body = rows.length ? rows.map(function (t) { return nextRow(model, t); }).join('') :
+    var body = rows.length ? rows.map(nextRow).join('') :
       '<div class="row calm">Nothing is waiting.</div>';
     return section('next', 'Up next', '', body);
   }
@@ -127,18 +115,27 @@ export const homeScript = String.raw `  var esc = Studio.ui.esc;
     return section('milestone', 'Milestone', '', body);
   }
 
+  // One event per task that has started or finished; the state word comes from its status now.
   function activityEvents(model) {
     var out = [];
     model.tasks.forEach(function (t) {
-      if (t.endT) out.push({ at: t.endT, id: t.id, what: 'completed' });
-      if (t.startT) out.push({ at: t.startT, id: t.id, what: 'started' });
+      var at = t.status === 'completed' ? (t.endT || t.startT) : t.startT;
+      if (at) out.push({ at: at, task: t });
     });
     return out.sort(function (a, b) { return b.at - a.at; }).slice(0, ACTIVITY_CAP);
   }
 
+  function activityState(t) {
+    var word = Studio.status.word(Studio.status.bucket(t));
+    var took = t.status === 'completed' && t.durationMs ? ', took ' + Studio.fmt.dur(t.durationMs) : '';
+    return word + took;
+  }
+
   function activityRow(e) {
-    return '<div class="row act-row" data-event="' + esc(e.id) + '"><span class="mono num when">' +
-      Studio.ui.when(e.at) + '</span><span class="mono id">' + esc(e.id) + '</span><span>' + e.what + '</span></div>';
+    var t = e.task;
+    return '<div class="row act-row" data-event="' + esc(t.id) + '"><span class="mono num when">' +
+      Studio.ui.when(e.at) + '</span><button type="button" class="t link" data-task="' + esc(t.id) + '">' +
+      esc(t.title) + '</button><span class="state">' + esc(activityState(t)) + '</span></div>';
   }
 
   function recentActivity(model) {

package/dist/server/studio-ui/pages/home/styles.js

@@ -1,20 +1,17 @@
 // Home page styles, all scoped under #panel-home. Ink: flat sections, one raised decision surface.
-export const homeCss = String.raw `#panel-home .home { max-width: 960px; display: flex; flex-direction: column; }
+export const homeCss = String.raw `#panel-home .home { display: flex; flex-direction: column; }
 #panel-home .page-head h1 { font-size: 22px; font-weight: 600; margin: 0 0 12px; letter-spacing: -.01em; }
 #panel-home .home-sec { border-top: 1px solid var(--line); padding: 12px 0; min-width: 0; }
 #panel-home .sec-head { display: flex; align-items: center; gap: 8px; min-height: 28px; }
 #panel-home .sec-head h2 { font-size: 13px; font-weight: 600; margin: 0; color: var(--fg-2); }
 #panel-home .sec-head .right { margin-left: auto; font-size: 12px; color: var(--fg-3); }
 #panel-home .mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }
-#panel-home .row { display: flex; align-items: center; gap: 12px; min-height: 36px; border-bottom: 1px solid var(--line); }
-#panel-home .row:last-child { border-bottom: 0; }
+#panel-home .row { display: flex; align-items: center; gap: 12px; min-height: 36px; }
 #panel-home .row .id { width: 72px; flex: none; color: var(--fg-2); font-size: 12px; }
 #panel-home .row .t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 #panel-home .link { background: none; border: 0; padding: 0; text-align: left; color: var(--fg); cursor: pointer; font: inherit; }
 #panel-home .agent { width: 96px; flex: none; color: var(--fg-2); font-size: 12.5px; }
 #panel-home .state { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; }
-#panel-home .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--fg-3); }
-#panel-home .dot.run { background: var(--run); }
 #panel-home .timer { width: 64px; text-align: right; font-size: 12px; }
 #panel-home .sub-row .log { flex: 1; min-width: 0; font-size: 12px; color: var(--fg-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 #panel-home .wait { color: var(--fg-3); font-size: 12.5px; }
@@ -30,7 +27,6 @@ export const homeCss = String.raw `#panel-home .home { max-width: 960px; display
 #panel-home .act-row .when { width: 72px; flex: none; font-size: 12px; color: var(--fg-3); }
 #panel-home .skel-row .skel { height: 12px; width: 100%; border-radius: 6px; background: var(--surface-2); }
 @media (max-width: 1024px) {
-  #panel-home .home { max-width: none; }
   #panel-home .agent { display: none; }
 }
 `;

package/dist/server/studio-ui/pages/tasks/script.js

@@ -3,11 +3,7 @@ export const tasksScript = String.raw `  var ui = Studio.ui;
   var CAP = 5;
   var view = { lastMs: null, showAll: false, open: {}, mode: null, filter: 'all', groups: {} };
   var KEY = 'nativ-studio:tasks-view';
-  var FILTERS = [['all', 'All'], ['running', 'Running'], ['ready', 'Ready'], ['blocked', 'Blocked'],
-    ['done', 'Done']];
-  var DOT = { completed: 'ok', in_progress: 'run', blocked: 'bad', ready: 'fg', waiting: 'faint' };
-  var LABEL = { completed: 'Done', in_progress: 'Running', blocked: 'Blocked', ready: 'Ready',
-    waiting: 'Waiting' };
+  var FILTERS = [['all', 'All']].concat(Studio.status.buckets);
 
   function readMode() {
     try { return localStorage.getItem(KEY) === 'board' ? 'board' : 'list'; } catch (e) { return 'list'; }
@@ -16,30 +12,15 @@ export const tasksScript = String.raw `  var ui = Studio.ui;
     try { localStorage.setItem(KEY, mode); } catch (e) { /* private mode */ }
   }
 
-  // Same notion of ready as Home and the sidebar: pending and every dependency done.
-  function isReady(model, t) {
-    if (t.status !== 'pending') return false;
-    return t.isAvailable || t.deps.every(function (d) {
-      var dep = model.byId && model.byId[d];
-      return !dep || dep.status === 'completed';
-    });
-  }
-  function kindOf(model, t) {
-    if (t.status === 'pending') return isReady(model, t) ? 'ready' : 'waiting';
-    return t.status;
-  }
   function matches(model, t, f) {
-    if (f === 'all') return true;
-    if (f === 'running') return t.status === 'in_progress';
-    if (f === 'blocked') return t.status === 'blocked';
-    if (f === 'done') return t.status === 'completed';
-    return isReady(model, t);
+    return f === 'all' || Studio.status.bucket(t) === f;
   }
 
   function toolbar(model) {
     var chips = FILTERS.map(function (f) {
       var on = view.filter === f[0];
       var n = model.tasks.filter(function (t) { return matches(model, t, f[0]); }).length;
+      if (!n && !on && f[0] !== 'all') return '';
       return '<button type="button" class="tf' + (on ? ' on' : '') + '" data-act="tasks-filter" data-filter="' +
         f[0] + '" aria-pressed="' + on + '">' + f[1] + ' <span class="num">' + n + '</span></button>';
     }).join('');
@@ -59,15 +40,17 @@ export const tasksScript = String.raw `  var ui = Studio.ui;
 
   // Rows use data-tid, not data-task, so the nested Dispatch button gets its own click.
   function listRow(model, t, fmt) {
-    var k = kindOf(model, t);
+    var bucket = Studio.status.bucket(t);
+    var wait = Studio.status.waitText(t);
     var id = ui.esc(t.id);
-    var go = k === 'ready' ? '<button type="button" class="tdispatch" data-act="tasks-dispatch" data-tid="' +
+    var go = Studio.status.isReady(t) ? '<button type="button" class="tdispatch" data-act="tasks-dispatch" data-tid="' +
       id + '">Dispatch</button>' : '';
     return '<div class="trow" role="row" tabindex="0" data-act="tasks-open" data-tid="' + id + '">' +
       '<span class="c-id mono" role="cell">' + id + '</span>' +
       '<span class="c-title" role="cell" title="' + ui.esc(t.title) + '">' + ui.esc(t.title) + '</span>' +
-      '<span class="c-agent" role="cell">' + ui.esc(t.agent || '') + '</span>' +
-      '<span class="c-status st-' + DOT[k] + '" role="cell"><i class="dot"></i>' + LABEL[k] + go + '</span>' +
+      '<span class="c-agent" role="cell">' + ui.esc(Studio.agentInfo(t.agent).label) + '</span>' +
+      '<span class="c-status st-' + bucket + '" role="cell">' + Studio.status.word(bucket) +
+      (wait ? ' <span class="faint">' + ui.esc(wait) + '</span>' : '') + go + '</span>' +
       '<span class="c-time mono" role="cell">' + ui.esc(timeOf(t, fmt)) + '</span></div>';
   }
 
@@ -86,7 +69,7 @@ export const tasksScript = String.raw `  var ui = Studio.ui;
     return '<section class="tgroup" role="table" aria-label="' + ui.esc(m.name) + '">' +
       '<button type="button" class="tg-head" data-act="tasks-group" data-group="' + ui.esc(m.id) +
       '" aria-expanded="' + open + '"><span class="chev">' + ui.icon('chev', 2) + '</span>' +
-      '<span class="mono faint">' + ui.esc(m.id) + '</span><span class="t">' + ui.esc(m.name) + '</span>' +
+      '<span class="mono faint">' + ui.esc(m.id) + '</span><span class="t" title="' + ui.esc(m.name) + '">' + ui.esc(m.name) + '</span>' +
       '<span class="num faint">' + m.done + ' of ' + m.total + '</span></button>' + body + '</section>';
   }
 
@@ -124,13 +107,13 @@ export const tasksScript = String.raw `  var ui = Studio.ui;
       var el = e.target;
       if (e.key !== 'Enter' || !el || !el.matches || !el.matches('.trow[data-tid]')) return;
       e.preventDefault();
-      Studio.taskAction('logs', el.getAttribute('data-tid'));
+      Studio.openTask(el.getAttribute('data-tid'));
     });
   }
 
   function head(m) {
     var lead = m ? ui.esc(m.name) : 'The work of one milestone, by state.';
-    return '<div class="panel-head"><div class="panel-title"><h1>Tasks</h1><p class="lead">' + lead + '</p></div>' +
+    return '<div class="panel-head"><div class="panel-title"><h1>Tasks</h1><p class="lead" title="' + lead + '">' + lead + '</p></div>' +
       '<div class="panel-actions">' + ui.milestoneSelect() + '</div></div>';
   }
 
@@ -138,7 +121,8 @@ export const tasksScript = String.raw `  var ui = Studio.ui;
 
   function metaHtml(t, fmt) {
     if (t.status === 'completed') {
-      return '<span>' + ui.esc(fmt.ago(t.endT)) + '</span>' + (t.durationMs ? '<span>took ' + ui.esc(fmt.dur(t.durationMs)) + '</span>' : '');
+      var took = t.durationMs ? '<span>took ' + ui.esc(fmt.dur(t.durationMs)) + '</span>' : '';
+      return '<span>' + ui.esc(fmt.ago(t.endT)) + '</span>' + took;
     }
     if (t.status === 'in_progress') {
       var live = t.startT ? '<span data-since="' + t.startT + '">' + fmt.dur(Studio.now() - t.startT) + '</span>' : '';
@@ -147,7 +131,7 @@ export const tasksScript = String.raw `  var ui = Studio.ui;
     if (t.status === 'blocked') {
       return '<span class="bad">Paused after ' + (t.attempt || t.maxAttempts) + ' of ' + t.maxAttempts + ' attempts</span>';
     }
-    if (t.waitingOn.length) return '<span>Waiting on ' + t.waitingOn.map(ui.esc).join(', ') + '</span>';
+    if (t.waitingOn.length && !t.stale) return '<span>Waits for ' + t.waitingOn.map(ui.esc).join(', ') + '</span>';
     return '<span>Ready to start</span>';
   }
 
@@ -157,8 +141,9 @@ export const tasksScript = String.raw `  var ui = Studio.ui;
       '<div class="title">' + ui.esc(t.title) + '</div><div class="meta">' + metaHtml(t, fmt) + '</div></button>';
   }
 
-  function column(label, status, list, shown, empty, extra, fmt) {
-    var body = shown.length ? shown.map(function (t) { return card(t, fmt); }).join('') : '<div class="col-empty">' + empty + '</div>';
+  function column(label, status, list, shown, extra, fmt) {
+    var body = shown.length ? shown.map(function (t) { return card(t, fmt); }).join('')
+      : '<p class="col-empty">None</p>';
     return '<div class="col" data-col="' + status + '"><div class="col-head">' + ui.statusIcon(status) + label +
       '<span class="count">' + list.length + '</span></div>' + body + (extra || '') + '</div>';
   }
@@ -169,12 +154,12 @@ export const tasksScript = String.raw `  var ui = Studio.ui;
     var shown = view.showAll ? done : done.slice(0, CAP);
     var more = done.length > CAP
       ? '<button type="button" class="more" data-act="tasks-more">' + (view.showAll ? 'Show fewer' : 'Show all ' + done.length) + '</button>' : '';
-    var up = by('pending'), run = by('in_progress'), stuck = by('blocked');
-    return '<div class="board">' +
-      column('Up next', 'pending', up, up, 'Nothing queued', '', fmt) +
-      column('Running', 'in_progress', run, run, 'No task is running', '', fmt) +
-      column('Just finished', 'completed', done, shown, 'Nothing finished yet', more, fmt) +
-      column('Stuck', 'blocked', stuck, stuck, 'Nothing is stuck', '', fmt) + '</div>';
+    var lanes = [['Up next', 'pending', by('pending'), null], ['Running', 'in_progress', by('in_progress'), null],
+      ['Done', 'completed', done, shown], ['Stuck', 'blocked', by('blocked'), null]];
+    var cols = lanes.map(function (l) {
+      return column(l[0], l[1], l[2], l[3] || l[2], l[1] === 'completed' ? more : '', fmt);
+    }).join('');
+    return '<div class="board">' + cols + '</div>';
   }
 
   function histRow(m, fmt) {
@@ -224,7 +209,7 @@ export const tasksScript = String.raw `  var ui = Studio.ui;
       },
       'tasks-filter': function (el) { view.filter = el.getAttribute('data-filter'); Studio.repaint('tasks'); },
       'tasks-clear': function () { view.filter = 'all'; Studio.repaint('tasks'); },
-      'tasks-open': function (el) { Studio.taskAction('logs', el.getAttribute('data-tid')); },
+      'tasks-open': function (el) { Studio.openTask(el.getAttribute('data-tid')); },
       'tasks-dispatch': function (el) { Studio.taskAction('dispatch', el.getAttribute('data-tid')); },
       'tasks-group': function (el, ctx) {
         var id = el.getAttribute('data-group');

package/dist/server/studio-ui/pages/tasks/styles.js

@@ -3,7 +3,7 @@ export const tasksCss = String.raw `#panel-tasks .board { display: grid; grid-te
 #panel-tasks .col { background: var(--surface-2); border-radius: 6px; padding: 8px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
 #panel-tasks .col-head { display: flex; align-items: center; gap: 8px; padding: 4px 6px 2px; font-weight: 500; font-size: 13px; }
 #panel-tasks .col-head .count { margin-left: auto; background: var(--surface); border-radius: 999px; padding: 0 8px; font-size: 12px; color: var(--fg-2); }
-#panel-tasks .col-empty { font-size: 12.5px; color: var(--fg-3); padding: 14px 8px; text-align: center; border: 1px dashed var(--line-2); border-radius: 6px; }
+#panel-tasks .col-empty { margin: 0; font-size: 12.5px; color: var(--fg-3); padding: 4px 2px; }
 #panel-tasks .tcard { display: flex; flex-direction: column; gap: 6px; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; padding: 10px; text-align: left; width: 100%; cursor: pointer; }
 #panel-tasks .tcard:hover { border-color: var(--line-2); }
 #panel-tasks .tcard.in_progress { border-color: color-mix(in srgb, var(--run) 45%, var(--line)); }
@@ -51,24 +51,24 @@ export const tasksCss = String.raw `#panel-tasks .board { display: grid; grid-te
 #panel-tasks .tg-head[aria-expanded="true"] .chev { transform: rotate(90deg); }
 #panel-tasks .trow {
   display: grid; grid-template-columns: 76px minmax(0, 1fr) 110px 150px 72px; gap: 12px;
-  align-items: center; height: 36px; padding: 0 8px; border-bottom: 1px solid var(--line);
+  align-items: center; height: 36px; padding: 0 8px;
   font-size: 13px; cursor: pointer;
 }
 #panel-tasks .trow:hover, #panel-tasks .trow:focus-visible { background: var(--surface-2); }
 #panel-tasks .trow:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
-#panel-tasks .trow.thead { cursor: default; color: var(--fg-3); font-size: 12px; background: none; }
+#panel-tasks .trow.thead { border-bottom: 1px solid var(--line); cursor: default; color: var(--fg-3); font-size: 12px; background: none; }
 #panel-tasks .trow .mono { font-variant-numeric: tabular-nums; font-size: 12px; }
 #panel-tasks .c-id { color: var(--fg-3); }
 #panel-tasks .c-title, #panel-tasks .c-agent { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 #panel-tasks .c-agent { color: var(--fg-2); }
 #panel-tasks .c-time { text-align: right; color: var(--fg-2); }
 #panel-tasks .c-status { display: flex; align-items: center; gap: 6px; }
-#panel-tasks .c-status .dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
-#panel-tasks .st-ok { color: var(--ok); }
-#panel-tasks .st-run { color: var(--run); }
-#panel-tasks .st-bad { color: var(--bad); }
-#panel-tasks .st-fg { color: var(--fg); }
-#panel-tasks .st-faint { color: var(--fg-3); }
+#panel-tasks .c-status { white-space: nowrap; overflow: hidden; }
+#panel-tasks .st-done { color: var(--ok); }
+#panel-tasks .st-running { color: var(--run); }
+#panel-tasks .st-stuck { color: var(--bad); }
+#panel-tasks .st-next { color: var(--fg); }
+#panel-tasks .panel-title .lead { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
 #panel-tasks .tdispatch {
   display: none; margin-left: auto; border: 1px solid var(--line-2); background: var(--surface);
   color: var(--fg); border-radius: 6px; padding: 2px 8px; font-size: 12px; cursor: pointer;